jQuery datatable fnDraw (false) не работает - PullRequest
0 голосов
/ 26 февраля 2020

Я использую DataTables 1.10.16 версию. После обновления значения я обновляю таблицу с обновленным значением. Единственная проблема заключается в том, что она не поддерживает состояние нумерации страниц.

пример : - Предположим, я нахожусь на странице 2, и после обновления значения оно обновляет значение, но выводит меня на первую страницу.

Я пытался fnDraw(false), но это не работает.

Инициализировать таблицу данных

$('.report-table').dataTable({
    bInfo: false,
    bLengthChange: false,
    serverside: true,
    stateSave: true,
    dom: '<"top"i>rt<"bottom"lp><"clear">',
    columnDefs: [{
            "orderable": false,
            "targets": 9
        },
        {
            "className": "text-center",
            "targets": 9
        }
    ],
    language: {
        oPaginate: {
            sNext: '<i class="fa fa-forward"></i>',
            sPrevious: '<i class="fa fa-backward"></i>',
            sFirst: '<i class="fa fa-step-backward"></i>',
            sLast: '<i class="fa fa-step-forward"></i>'
        },
        emptyTable: "No application found"
    },
    serverMethod: 'get',
    ajax: {
        url: 'https://www.googl.com',
        data: {
            startDate: startDate,
            endDate: endDate,
        },
        headers: {
            'X-CSRF-TOKEN': "{{csrf_token()}}"
        }
    },
    createdRow: function(row, data, dataIndex) {
        $(row).attr('data-app-id', data.app_id);
    },
    columns: [{
            "data": "app_id",
            render: function(data) {
                var firstColumn = data + '<i class="app-expand-btn fa fa-plus-circle pull-right" aria-hidden="true"></i>'
                return firstColumn;
            }
        },
        {
            "data": "app_name"
        },
        {
            "data": "ad_requests"
        },
        {
            "data": "impressions"
        },
        {
            "data": "fill_rate"
        },
        {
            "data": "clicks"
        },
        {
            "data": "ctr"
        },
        {
            "data": "ecpm"
        },
        {
            "data": "revenue"
        },
        {
            "data": "app_id",
            render: function(data) {
                var lastColumn = '<div class="action-box-tools">\n' +
                    '<a class="application-edit-btn" data-placement="top"  data-toggle="tooltip-custom" data-tooltip-value="Edit"><i class="fa fa-pencil"></i> </a>' +
                    '<a class="application-status-btn" data-placement="top"  data-toggle="tooltip-custom" data-tooltip-value="Activate application"><i class="fa fa-play"></i></a>' +
                    '</div>'
                return lastColumn
            }
        },
    ]
});

Refre sh table

$.getJSON("{{url('https: //www.xyz.com')}}", params, function(json) {
    oSettings = $('.report-table').dataTable().fnSettings();
    $('.report-table').dataTable().fnClearTable(this);
    for (var i = 0; i < json.data.length; i++) {
        $('.report-table').dataTable().oApi._fnAddData(oSettings, json.data[i]);
    }
    oSettings.aiDisplay = oSettings.aiDisplayMaster.slice();
    $('.report-table').dataTable().fnDraw(false);
});

1 Ответ

1 голос
/ 26 февраля 2020

вы можете достичь этого с помощью ajax, ничья - это в основном функция сброса, есть обходной путь с рисованием, который вы можете найти в inte rnet

Я обычно использую следующее с серверной стороны: true, обработка: истина, сохранение состояния: истина

mytable.ajax.reload(null, false);

и изменение

dataTable

на

DataTable

. поскольку dataTable - это jquery obj, а DataTable - это экземпляр данных

, вам следует использовать id вместо класса, чтобы избежать каких-либо проблем,

var mytable = $('.report-table').dataTable({
    bInfo: false,
    bLengthChange: false,
    serverside: true,
    stateSave: true,
    processing: true, // also add this
    . . .

, и это будет работать где угодно, если только вы не определили datatable в какой-то функции. например, followincode перезагрузит таблицу при нажатии btn

$('#btn').click(function(){
  mytable.ajax.reload(null, false);
});

, ссылаясь на ajax .reload

...