JQuery: Dataatable не показывает данные должным образом после прокрутки таблицы - PullRequest
1 голос
/ 14 февраля 2020

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

: всего записей 105, а длина записей 30, но после прокрутки отображается пустая область, а после 2-го / 3-го тиража карты снова отображаются.

Ниже приведен пример .

$(document).ready(function () {
    $(document).on('preInit.dt', function (e, settings) {
        let api = new $.fn.dataTable.Api(settings);
        api.page.len(30);
    });
    var dtable = $('#paginatedTable').dataTable({
        "processing": true,
        "serverSide": true,
        "searching": true,
        "deferRender": false,
        "order": [[0, "asc"]],
        "ajax": {
            "url": "/users/paginated/mysql"
        },
        "scrollY": '300px',
        "scroller": {
            " loadingIndicator": true,

        },
        "columns": [
            { "data": "id" },
            { "data": "name" },
            { "data": "salary" }
        ],
        "createdRow": function (row, data, index) {

            if (data.id) {
                $('td', row).eq(0).addClass('text-left position-absolute l-0');
                $('td', row).eq(1).addClass('text-right position-absolute r-0');
                $('td', row).eq(1).addClass('alert-danger');
            }

        },

    });

    $('#search').on('keyup', function () {
        dtable.fnFilter(this.value);
    });
    $("#sortingId").change(function () {
        dtable.fnSort([0, $("#sortingId").val()]);
    });
    $("#sortingName").change(function () {
        dtable.fnSort([1, $("#sortingName").val()]);
    });

});

Снимок экрана: Сценарий сбоя, упомянутый выше сценарий рабочий сценарий - если в строке только одна карта, прокрутка работает нормально

...