перерисовка данных после вызова ajax

#jquery #ajax #datatables

#jquery #ajax #таблицы данных

Вопрос:

У меня есть таблица данных с фильтрами. Я использую Ajax каждые 10 секунд для извлечения новых данных и добавления новых строк в таблицу. (данные таблицы являются динамическими на одной странице, а не с помощью ajax)

 $(function () {
    setInterval(checkNew,1000*10);

    $( "#orderdate" ).datepicker({
        changeMonth: true,
        changeYear: true,
        yearRange: '2013:2050',
        dateFormat:"dd-mm-yy",
        showAnim:"fold"
    });

    var table = $('#data').DataTable({
        "lengthMenu": [[-1], ["All"]],
        "bSort": false,
        "paging":   false,
    });

    $("#status").change(function() { table.column(4).search($(this).val()).draw() });

});

function checkNew(){
    $.post('getdata.php',{max: $("#lastid").text().trim() }).done(function (data) {
        if( data.trim() !== '' ) {
            $("table#data").prepend(data.trim());
            //need to draw datatable to filter and search new data added to the table
        }
    });
}
 

Как вы видите, я пытаюсь обновить или нарисовать таблицу с новыми данными, чтобы я мог фильтровать или искать их. Если я буду искать новые данные, они не будут отображаться, потому что они не были загружены с помощью DOM. Но я не могу перерисовать таблицу, которую я пробовал

 $("table#data").DataTable().draw(); // new rows are added but can't be searched or filtered
 

И

 $('table#data').dataTable().fnDraw(); //new rows are not added
 

Итак, как отредактировать код в любом случае, чтобы правильно нарисовать таблицу для фильтрации и поиска новых добавленных данных?

Ответ №1:

Datatables предоставляет встроенную функциональность для обработки загрузки данных из запроса ajax в таблицу. Кроме того, он предоставляет метод перезагрузки, который обновит данные в таблице.

В вашем случае вы должны быть в состоянии сделать что-то вроде:

 var table = $('#data').DataTable( {
    ajax: "getdata.php"
});
 

и затем:

 setInterval( function () {
    table.ajax.reload();
}, 10000 );
 

Существуют дополнительные параметры, которые вы можете передать в качестве аргументов функции перезагрузки в зависимости от вашего варианта использования. Надеюсь, это поможет!

Комментарии:

1. в getdata.php и внутри lopp, который получает строки $myrows[] = «<tr role=’row’> <td>».$row[‘orderid’].»</td> <td>».$row[‘first_name’].’ ‘.$row[‘last_name’].»</td> <td>».date(‘d-m-Y’,$row[‘unix_time’]).»</td> <td>».$row[‘final_total’].»</td> <td> .».$row[‘name’].»</td> </ tr>»; } echo json_encode($myrows); в индексе я получаю эту ошибку «недопустимый ответ json»

2. [обновление] в цикле: $ arr [] = $row; чтобы получить всю строку информации, но мне нужно выбрать некоторые конкретные данные, всего 4 поля и все равно получить ту же ошибку «выбрать orders.id как идентификатор заказа,orders.unix_time,orders.final_total,orders.user_id,orders.auto_cancel,users.id как идентификатор пользователя, users.first_name, users.last_name, payment_methods_translation. payment_method_id, payment_methods_translation. имя из orders,users,payment_methods_translation где orders.id =’$id’ и orders.user_id = users.id и заказы.payment_method_id = payment_methods_трансляция. payment_method_id и orders.auto_cancel=’1′»

3. [обновление] я правильно меняю свой код, но на вкладке сети консоли я нахожу этот ajax «mydomain.com//getdata.php?_=1476648685734 » нет «mydomain.com//getdata.php?_=1476648685734 «что означает, что URL-адрес ajax неверен, я не знаю, почему он был изменен, поэтому я получаю сообщение об ошибке (домен https)

4. обновлено, пожалуйста, просмотрите. Теперь я получаю данные json, но в таблице ничего не отображается, она просто говорит «загрузка»

5. @PHPUser Пожалуйста, не меняйте свой вопрос после получения ответа. Если у вас есть новый вопрос, задайте новый вопрос.