Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 11.04.2018, 00:27
Интересующийся
Отправить личное сообщение для mishapod Посмотреть профиль Найти все сообщения от mishapod
 
Регистрация: 01.02.2017
Сообщений: 20

Динамически обновленная таблица HTML работает неправильно
У меня проблема, динамически обновляемая таблица не работает. Когда я вручную обновляю страницу, она работает правильно, я могу удалить запись. Как только я добавлю пользователя в таблицу, таблица динамически обновляется через базу данных, но потом я не могу удалить записи. Такое чувство что на этой странице нет таблицы.


// AJAX - dynamically update the table.    
          function dynamicTable() {
            $.ajax({
              type: 'GET',
              url:  'table.php',
              dataType: "html", 
              success: function( html ){
                console.log(html);
                $("#trash").html(html);
              }
            }); 
          }
    //AJAX - delete record
      $('#trash td').on('click', function(e) {
        console.log(111)
          // e.preventDefault();
    
        // if you do NOT click on the picture -> exit
        if (e.target.nodeName != 'IMG') {
            return false;
        } else {
            let id = $(this).data('label');
            $(this).parent('tr').remove();
            // get the text from the `ID U` for deletion by id
            var parentDel = this.parentElement.children[1].textContent;
        }                             
            $.ajax({
            type: 'POST',
            url:  'regist.php',
            data: {
               id_delete: parentDel,
            },
            success: function( response ){
              dynamicTable();
              console.log(response);
            }
        });
      });


----------


    $query = 
        'SELECT phones_users.id,
             phones_users.id_user,
             users.user_first_name,
             users.user_last_name,
             phones_users.phone_1,
             phones_users.phone_2
         FROM users
         INNER JOIN
             phones_users
         ON   
             users.id = phones_users.id_user';
    
    $result = mysqli_query($con, $query);
    $count_users = mysqli_num_rows($result);
    
    if ($count_users) {
        while ($row = mysqli_fetch_array($result)) {
    
    
            echo "<tr><td data-label='ID R'>$row[0]</td><td data-label='ID U'>$row[1]</td><td data-label='Name'>$row[2]</td><td data-label='Last Name'>$row[3]</td><td data-label='Phone 1'>$row[4]</td>
                <td data-label='Phone 2'>$row[5]</td>
                <span><td style='padding: 5px;'>
                    <a href='#'>
                        <img src='img/trash.png' width='25px' height='25px'>
                    </a>
                </td></span>
                </tr>
            ";
        }




    // var_dump($query);
    }
    ?>
Ответить с цитированием
  #2 (permalink)  
Старый 11.04.2018, 01:50
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,989

Сообщение от mishapod
$('#trash td').on('click'
Это для тех TD что были на странице на момент установки обработчика, а те что появляются динамически, это другие TD. Делегировать нужно:

$('#trash').on('click', 'td', function()....
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Ошибка в коде Js, Неправильно работает скрипт. Julia Panatova Общие вопросы Javascript 1 19.01.2011 14:12
Ошибка в коде Js, Неправильно работает скрипт. Julia Panatova Общие вопросы Javascript 7 07.01.2011 13:41
Скрипт неправильно работает в FF InviS Общие вопросы Javascript 6 11.04.2010 16:56
AJAX - заполнение select - неправильно работает в Mozilla 5.0 С.Тарасов AJAX и COMET 0 17.06.2009 00:58
java-script фотогалерея, неправильно работает в ИЕ6 Scroll Internet Explorer 1 03.12.2008 14:16