Не удается повторно инициализировать DataTable-динамические данные для datatable

у меня есть datatable, показывающий всех сотрудников. Он отлично работает для всех сотрудников на document.ready. У меня есть тег select, содержащий тип сотрудников, таких как 'project_manager' & 'team_leader', а при смене типа сотрудника вызываю функцию get_employees(emp_type) и передача выбранного типа сотрудника.

он получает желаемые и правильные данные в ответе ajax, но бросает предупреждение

DataTables warning: table id=example - Cannot reinitialise DataTable. For more information about this error, please see http://datatables.net/tn/3

Я пытался уничтожить его, но не повезло.

также пытались

$('#example').dataTable().fnClearTable();
$('#example').dataTable().fnDestroy();

это очистка таблицы и отображение новых добавленных данных, но добавление новых изображений сортировки с именем столбца каждый раз.

вот мой фрагмент кода.

$(document).ready(function() {
            get_employees('all');
        });

        function get_employees(emp_type)
        {
            $.ajax({
                url: '../ajax_request.php',
                type: "POST",
                data: {
                    action: "admin_get_all_employees",
                    type: emp_type
                },
                success: function(response) {
                    var response = jQuery.parseJSON(response);

                    // $('#example').destroy(); tried this but haven’t worked

                    $('#example').dataTable({
                        "aaData": response.data,
                    });
                }
            });
        }

спасибо заранее.

16
ajax datatable destroy dynamic jquery

3 ответов

в текущей версии DataTables (1.10.4) вы можете просто добавить destroy:true к конфигурации, чтобы убедиться, что любая таблица уже присутствует удалена перед повторной инициализацией.

$('#example').dataTable({
    destroy: true,
    aaData: response.data
});
45

эта техническая заметка раздел из datatables объясняет причину этого предупреждения. Соответствующая информация оттуда:

эта ошибка запускается путем передачи параметров в DataTables объект конструктора, когда экземпляр DataTable для выбранного узла уже инициализирован. Например:

$('#example').dataTable( {
    paging: false
} );


$('#example').dataTable( {
    searching: false
} );

в приведенной выше документации объясняется два способа справиться с этим.

  1. Retrieve: он объясняет, как примените дополнительные параметры после инициализации (работает, даже если он не инициализирован раньше) с помощью параметра извлечь to правда следующим образом:
table = $('#example').DataTable( {
    retrieve: true,
    paging: false
} );

  1. Destroy: в этом случае вы можете уничтожить объект явно, вызвав table.destroy(); и затем создание таблицы снова. Или вы можете просто пройти destroy: true вариант как упомянуто в принятом ответ.

    table = $('#example').DataTable( {
    paging: false
} );

table.destroy();

table = $('#example').DataTable( {
    searching: false
} );

использование destroy: true option:

$('#example').DataTable( {
    destroy: true,
    searching: false } );

Примечание: эта ошибка также может возникнуть, если включить файл javascript, который создает dataTable несколько раз. Я использовал плитки apache и включил его в базу, а также расширенное определение, которое также привело к этой ошибке.

2

попробуйте что-то вроде ниже

    var $table=$('#example').dataTable({
                    "aaData": response.data,
                });


    $table.fnDestroy();
0