За последние 24 часа нас посетили 54886 программистов и 1722 робота. Сейчас ищут 854 программиста ...

Как узнать и присвоить изменение в AJAX

Тема в разделе "JavaScript и AJAX", создана пользователем igroc, 29 авг 2014.

  1. igroc

    igroc Активный пользователь

    С нами с:
    15 июл 2014
    Сообщения:
    75
    Симпатии:
    1
    Всем привет
    есть код
    Код (Text):
    1. echo "<table border='1'>
    2. <tr><td align='center'>Раздел</td>
    3. <td align='center'>Подраздел</td>
    4. <td align='center'>Товар</td>
    5. <td align='center'>Описание</td>
    6. <td align='center'>Цена</td>
    7. <td align='center'></td>
    8. </tr>";
    и JavaScript
    Код (Text):
    1. <script type="text/javascript">
    2. $(function()    {
    3.     $('td').click(function(e)   {
    4.         //ловим элемент, по которому кликнули
    5.         var t = e.target || e.srcElement;
    6.         //получаем название тега
    7.         var elm_name = t.tagName.toLowerCase();
    8.         //если это инпут - ничего не делаем
    9.         if(elm_name == 'input') {return false;}
    10.         var val = $(this).html();
    11.         var code = '<input type="text" id="edit" value="'+val+'" />';
    12.         $(this).empty().append(code);
    13.         $('#edit').focus();
    14.         $('#edit').blur(function()  {
    15.             var val = $(this).val();
    16.             $(this).parent().empty().html(val);
    17.         });
    18.     });
    19. });
    20.  
    21. $(window).keydown(function(event){
    22.     //ловим событие нажатия клавиши
    23.     if(event.keyCode == 13) {   //если это Enter
    24.         $('#edit').blur();  //снимаем фокус с поля ввода
    25.     }
    26. });
    27.  
    28. </script>
    как при потере фокуса сохранить в базе данных

    код выводит таблицу скрипт дает возможность исправить данные но как занести в sql таблицу не пойму
    предполагаю надо вставить в скрипт что то типа
    Код (Text):
    1. $.ajax({
    2.  
    3. type: "POST",
    4.  
    5. url: "/savedoc.php",
    6.  
    7. data: "data="+data,
    8.  
    9. success: function(html) {
    10.  
    11. $("#edited").append(html);
    а как не пойму

    и что в savedoc.php написать то
     
  2. Your

    Your Старожил

    С нами с:
    2 июл 2011
    Сообщения:
    4.074
    Симпатии:
    7
    Код (PHP):
    1. $('#edit').blur(function() {
    2.     $.post('savedoc.php',{
    3.         data:data
    4.     },function(html) {
    5.         $("#edited").append(html);
    6.     });
    7. });
    http://api.jquery.com/jquery.post/
     
  3. igroc

    igroc Активный пользователь

    С нами с:
    15 июл 2014
    Сообщения:
    75
    Симпатии:
    1
    это я понял передача выбранного значения
    а как определить к какому столбцу и строчке присвоилось что бы сохранить в базе данных
     
  4. igordata

    igordata Суперстар
    Команда форума Модератор

    С нами с:
    18 мар 2010
    Сообщения:
    32.408
    Симпатии:
    1.768
    Ты должен при выводе таблицы где-то не обязательно явно но обязательно в каждую строку впихнуть праймари кей или иной уникальный индекс. Логично будет впихнуть его в ближайший tr в дата-аттрибут <tr data-id="73">. Соотв из любой ячейки он будет доступен через $(this).parent().data('id') например.
     
  5. igroc

    igroc Активный пользователь

    С нами с:
    15 июл 2014
    Сообщения:
    75
    Симпатии:
    1
    смысл понял
    echo "<tr><td data id="'A'.$row['id'].">".$row['razdel']."</td>";
    как правильно написать
     
  6. igordata

    igordata Суперстар
    Команда форума Модератор

    С нами с:
    18 мар 2010
    Сообщения:
    32.408
    Симпатии:
    1.768
    Дефис забыл.
     
  7. igroc

    igroc Активный пользователь

    С нами с:
    15 июл 2014
    Сообщения:
    75
    Симпатии:
    1
    неполучается
     
  8. igordata

    igordata Суперстар
    Команда форума Модератор

    С нами с:
    18 мар 2010
    Сообщения:
    32.408
    Симпатии:
    1.768
    совсем не то же самое
     
  9. igroc

    igroc Активный пользователь

    С нами с:
    15 июл 2014
    Сообщения:
    75
    Симпатии:
    1
    пытаюсь сделать типа морского боя

    while($row = mysql_fetch_array($res)){
    echo "<tr><td data-id='A".$row['id']."'>".$row['razdel']."</td>";
    echo "<td data-id='B".$row['id']."'>".$row['podrazdel']."</td>";
    echo "<td data-id='C".$row['id']."'>".$row['tovar']."</td>";
    echo "<td data-id='D".$row['id']."'>".$row['opisanie']."</td>";
    echo "<td data-id='E".$row['id']."'>".$row['prais']."</td>";
    echo "</tr>";



    }

    а потом определить например А5, В3 и т.д.

    или не так не понимаю
     
  10. igordata

    igordata Суперстар
    Команда форума Модератор

    С нами с:
    18 мар 2010
    Сообщения:
    32.408
    Симпатии:
    1.768
    <td data-x='A' data-y='5'

    $(this).data('x')
    $(this).data('y')
     
  11. igroc

    igroc Активный пользователь

    С нами с:
    15 июл 2014
    Сообщения:
    75
    Симпатии:
    1
    не понимаю давай вопрос уточню
    есть таблица которая собирается из базы данных
    нужно что бы когда я поменял данный в полученной таблице при потере фокуса
    скриптом
    Код (Text):
    1. <script type="text/javascript">
    2. $(function()   {
    3.    $('td').click(function(e)   {
    4.       //ловим элемент, по которому кликнули
    5.       var t = e.target || e.srcElement;
    6.       //получаем название тега
    7.       var elm_name = t.tagName.toLowerCase();
    8.       //если это инпут - ничего не делаем
    9.       if(elm_name == 'input')   {return false;}
    10.       var val = $(this).html();
    11.       var code = '<input type="text" id="edit" value="'+val+'" />';
    12.       $(this).empty().append(code);
    13.       $('#edit').focus();
    14.       $('#edit').blur(function()   {
    15.          var val = $(this).val();
    16.          $(this).parent().empty().html(val);
    17.       });
    18.    });
    19. });
    20.  
    21. $(window).keydown(function(event){
    22.    //ловим событие нажатия клавиши
    23.    if(event.keyCode == 13) {   //если это Enter
    24.       $('#edit').blur();   //снимаем фокус с поля ввода
    25.    }
    26. });
    27.  
    28. </script>
    данные в базе по факту тоже правились сразу же
    что брать отсюдова и передать в файл который обработает
    (обновит данные в таблице)
    и как это сделать
     
  12. igordata

    igordata Суперстар
    Команда форума Модератор

    С нами с:
    18 мар 2010
    Сообщения:
    32.408
    Симпатии:
    1.768
    что не понимаешь - спрашивай. или я могу перенести тему в "сделайте за меня" где она и умрёт счастливо
     
  13. igroc

    igroc Активный пользователь

    С нами с:
    15 июл 2014
    Сообщения:
    75
    Симпатии:
    1
    Вот до чего дошел
    index.php
    Код (Text):
    1. <head>
    2. <link rel="stylesheet" type="text/css" href="style.css" />
    3. <script src="jquery.js" type="text/javascript"></script>
    4.  
    5. <script>
    6.  
    7.     $(document).ready(function(){
    8.                                    
    9.                                    
    10.                                    
    11.         $('td.edit').click(function(){
    12.                              
    13.                         if($('#editbox').length>0) {return false}
    14.                
    15.                                         $('.ajax').html($('.ajax input').val());
    16.                                         $('.ajax').removeClass('ajax');
    17.                                        
    18.                                         $(this).addClass('ajax');
    19.                                         $(this).html('<input id="editbox" size="'+$(this).text().length+'" type="text" value="' + $(this).text() + '">');
    20.                                        
    21.                                         $('#editbox').focus();
    22.                                        
    23.                                   }
    24.                          
    25.                          
    26.                          
    27.                          
    28.                          );
    29.                      
    30.         $('td.edit').keydown(function(event){
    31.                                      
    32.                                      
    33.                                      arr = $(this).attr('class').split( " " );
    34.                                      
    35.                                      
    36.                                      if(event.which == 13)
    37.                                      {
    38.                                        
    39.                                         $.ajax({    type: "POST",
    40.                                                     url:"config.php",
    41.                                                     data: "value="+$('.ajax input').val()+"&rownum="+arr[2]+"&field="+arr[1],
    42.                                                     success: function(data){
    43.                                                          $('.ajax').html($('.ajax input').val());
    44.                                                          $('.ajax').removeClass('ajax');
    45.                                                     }});
    46.                                      }
    47.                                  
    48.                                   }
    49.                          
    50.                          
    51.                          
    52.                          
    53.                          );
    54.        
    55.        
    56.         $('#editbox').live('blur',function(){
    57.  
    58.                                      $('.ajax').html($('.ajax input').val());
    59.                                      $('.ajax').removeClass('ajax');
    60.                                     });
    61.                                    
    62.        
    63.    
    64.     });
    65.  
    66.  
    67. </script>
    68.  
    69.  
    70. </head>
    71.  
    72. <body>
    73.  
    74.  
    75.  
    76. <table cellpadding="15">
    77.  
    78. <tr>
    79. <th>Номер</th>
    80. <th>Цена</th>
    81. </tr>
    82.  
    83.  
    84. <?
    85.  
    86.     include('config.php');
    87.    
    88.     $result = get_data();
    89.    
    90.     while($rows = mysql_fetch_array($result))
    91.     {
    92.     echo '<td>'.$rows["id"].'</td>
    93.         <td class="edit price '.$rows["id"].'">'.$rows["prais"].'</td>
    94.         </tr>';
    95.     }
    96. ?>
    97.  
    98. </table>
    99. </body>
    100. </html>
    config.php
    Код (Text):
    1. <?
    2.  
    3.  
    4. include '../baza.tpl';
    5.  
    6.  
    7.  
    8.  
    9.  
    10. /*Проверка, все ли данные из браузера*/
    11.  
    12. if(isset($_POST['rownum']))
    13. {
    14.     update_data($_POST['field'],$_POST['value'],$_POST['rownum']);
    15. }
    16.  
    17. /*Извлечение записей из БД*/
    18. function get_data()
    19. {
    20.    
    21.     $sql = "select * from tovar";
    22.     $rs = mysql_query($sql);
    23.     return $rs;
    24. }
    25.  
    26. /*Обновление записей в БД*/
    27. function update_data($field, $data, $rownum)
    28. {
    29.  
    30.    
    31.     $sql = "update tovar set ".$field." = '".$data."' where id = ".$rownum;
    32.    
    33.     mysql_query($sql) or die("Couldn't connect to db");
    34.    
    35.    
    36. }
    37.  
    38. ?>
    чувствую что где-то рядом
    в базе не сохраняет
    что не так?
     
  14. igordata

    igordata Суперстар
    Команда форума Модератор

    С нами с:
    18 мар 2010
    Сообщения:
    32.408
    Симпатии:
    1.768
    а запрос происходит? а куда надо происходит? смотри запарос в браузере. Умеешь?
     
  15. igroc

    igroc Активный пользователь

    С нами с:
    15 июл 2014
    Сообщения:
    75
    Симпатии:
    1
    нет а как посмотреть не умею
     
  16. igordata

    igordata Суперстар
    Команда форума Модератор

    С нами с:
    18 мар 2010
    Сообщения:
    32.408
    Симпатии:
    1.768
    ну если у тебя хром допустим или там фф, то тыкаешь правой кнопкой и в меню выбираешь Inspect Element, дальше на вкладке network будут логироваться все запросы. можно тыкнуть в него и увидеть все заголовки запроса, ответа, и самое тело.
     
  17. igroc

    igroc Активный пользователь

    С нами с:
    15 июл 2014
    Сообщения:
    75
    Симпатии:
    1
    вот что выдал
    config.php
    /ajax
    POST 200
    OK
    text/html jquery.js:130
    Script
    292 B
    22 B
    42 ms
    41 ms
     
  18. igordata

    igordata Суперстар
    Команда форума Модератор

    С нами с:
    18 мар 2010
    Сообщения:
    32.408
    Симпатии:
    1.768
    нене
    ты должен сам определить, попал ли запрос туда куда надо и ответил ли скрипт то, что требуется. я ж не знаю задумки. твой код я не хочу читать =)
     
  19. igroc

    igroc Активный пользователь

    С нами с:
    15 июл 2014
    Сообщения:
    75
    Симпатии:
    1
    все спасибо нашел слово в базе prais не правильно написано было

    все тему считаю закрытой
     
  20. igordata

    igordata Суперстар
    Команда форума Модератор

    С нами с:
    18 мар 2010
    Сообщения:
    32.408
    Симпатии:
    1.768
    тебе надо освоить mysqli или PDO и работу с эксепшенами.