datatables не может повторно инициализировать DataTable и уничтожить не работает

Question

Я попробовал все команды для уничтожения и очистки данных после выбора новой опции и не работает.

это часть моего js-файла, содержащего ajax. он использует динамические URL-адреса apis.

    function table(url, columns) {

        var dt = $("#datatables").dataTable({
            "serverSide": true,
            "processing": true,
            "ajax": {
                "url": url,
                "type": "GET",
            },
            "columns": columns,
            lengthMenu: [[25, 100, 250, 500], [25, 100, 250, 500]],
            pageLength: 25,
            // destroy: true
        });
    ... // more stuff here about the design of the table
    }

    $("form#btnGetDomain").on("submit", function (ev) {
        ev.preventDefault();
        ev.stopPropagation();

        // $("#datatables").dataTable().fnDestroy();

        var url;
        var columns;

        var categ = document.getElementById("categ").value;

    // this is where i do if statements depending what options was selected
// i get the proper url api
    ... 

        table(url, columns);
    });

Я попробовал все эти команды:

$("#datatables").dataTable().fnDestroy();

$("#datatables").empty();


destroy: true,

Команда "destroy: true" внутри dataTable. Я не знаю, работает ли она должным образом, потому что после второй попытки выбора другой опции таблица не отвечает, она просто говорит ** Обработка .... **

Я также пытался поместить команду внутри функции отправки, прежде чем выбрать любую опцию для очистки таблицы. Теперь я думаю о том, чтобы сделать оператор if, если это таблица, очистить его.

Спасибо

UPDATE

Я пытался использовать dataTable и DataTable

** ОБНОВЛЕНИЕ 2 **

if ($.fn.DataTable.isDataTable("#datatables")) {
        $("#datatables").DataTable().clear().draw();
        $("#datatables").dataTable().fnDestroy();
    }

Эту команду я поставил перед var dt = $ ("# datatables"). DataTable ({...

Да, я заметил, что использовал маленькую и большую кепку с данными ... но это сработало ... я пытался поставить оба с большим D , но не работало ... также пытался использовать в последний: DataTable (). destroy (); ... не работал

Пример: использование видео и каналов Я выбрал первый раз видео.

После того, как я выбрал каналы: Это меняет имена столбцов без проблем (у меня разные имена столбцов для каждого API) ... но строки остаются теми же.

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

Надеюсь, вы понимаете. Не имеет смысла, почему я должен использовать dataTable и DataTable ...

оно меняется, но неправильно меняется ... по крайней мере, я все ближе к ответу, надеюсь.

Answer 1

Я нашел ответ, я поместил эти строки кода в начало табличной функции

function table(url, columns) {
    var dt;

    if ($.fn.DataTable.isDataTable("#datatables")) {
        $("#datatables").DataTable().clear().draw();
        $("#datatables").DataTable().destroy();
        $("#datatables thead").html('');
    }

...
}

У меня это нормально работает, очищает строки, уничтожает таблицу и очищает thead .

Оу, и у меня есть изменения с нижнего регистра dataTable слишком верхний регистр DataTable

Answer 2

Обновление : Вы пробовали команду очистки? https://datatables.net/reference/api/clear()

$('#datatables').DataTable().clear().draw();

Еще одна вещь, которую вы можете попробовать - использовать переменную для уничтожения таблицы:

var dt = $('#datatables').DataTable({...init stuff...});
dt.destroy();

---

Это может быть проблема с версией DT. Вы пробовали:

$('#datatables').DataTable().destroy();

Обратите внимание, что разница между dataTable и DataTable.