jQuery DataTables обновляют сетку, когда источником данных является массив - PullRequest
0 голосов
/ 14 апреля 2019

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

Нажав на эту кнопку, я загружу, используя ajax, поток JSON из API. Данные будут обработаны и затем установлены в качестве источника данных в таблицах данных.

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

Код следующий (для простоты удалена функция обработки данных):

function loadBulletins(categoryID) {
    $.ajax({
        url: '/api/bulletins.ashx',
        type: "POST",
        dataType: "json",
        data: { method: "getbulletins", iso3: iso3, catid:categoryID },
        success: function (response) {
            if ($.fn.dataTable.isDataTable('#bulletins-table')) {
                table = $('#bulletins-table').DataTable();
                table.clear();
                table.data(response.data); //it seems like the update here doesn't work
                table.draw();  //Table is not updated!!
                //table.ajax.reload();  //it only works with ajax builtin
            }
            else {
                $('#bulletins-table').DataTable({
                    deferRender: true,
                    "bLengthChange": false,
                    responsive: true,
                    "autoWidth": false,
                    "bInfo": false,
                    "bFilter": false,
                    data: response.data
                });
            }
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
            console.log("loadBulletins Status: " + textStatus, "Error: " + errorThrown);
        }
    });
}

Вышеуказанная функция вызывается, когда пользователь нажимает на некоторые кнопки, передавая разные значения categoryID, следовательно, загружая разные данные из API.

Данные, возвращаемые из API, выглядят следующим образом:

{
    "data": [
        ["8", "Emergency Assessment: Faryab Province", "2", "2018", "00065098/download/", "", "", "", ""],
        ["", "XXX/NRC Emergency Shelter Assessment: Khogiani", "12", "2017", "00050404/download/", "", "", "", ""],
        ["7", "Emergency Market Assessment: Sayad and Qush Tepa Districts", "9", "2017", "000022544/download/", "", "", "", ""],
        ["6", "Emergency Assessment Bulletin: Darz Ab District (Jawzjan) - Rapid Assessment", "7", "2017", "019342/download/", "", "", "", ""],
        ["5", "Emergency Flash Update: Bala Buluk District: Farah Province - Conflict Rapid Assessment", "3", "2017", "1236.pdf", "", "", "", ""],
        ["4", "Emergency Flash Update: Faryab Province - Conflict Rapid Assessment", "1", "2017", "754.pdf", "", "", "", ""],
        ["3", "Emergency Flash Update: Kohistan District (Faryab) - Conflict Rapid Assessment", "11", "2016", "8973.pdf", "", "", "", ""],
        ["2", "Emergency Flash Update: Farah Province - Conflict Rapid Assessment", "11", "2016", "88394.pdf", "", "", "", ""],
        ["1", "Emergency Flash Update: Kunduz Province - Conflict Rapid Assessment", "10", "2016", "88308.pdf", "", "", "", ""]
    ]
}

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

При втором щелчке, вызов ajax работает, как я вижу ответ на вкладке сети, но дата не обновляется . Я попробовал все предложения в документации, но ни одно из них не работает, и они обычно ссылаются на встроенную функцию ajax в datatable.

1 Ответ

2 голосов
/ 14 апреля 2019

вместо

table.rows.add(response.data); 

вместо

table.data(response.data);

или уничтожить и повторно инициализировать данные.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...