Невозможно повторно инициализировать 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,
                    });
                }
            });
        }

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

Ответы

Ответ 1

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

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

Ответ 2

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

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

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


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

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

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

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

Использование функции destroy: true:

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

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

Ответ 3

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

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


    $table.fnDestroy();