JQuery DataTables - не работает перезагрузка AJAX

Question

Я использую DataTables для отображения некоторых данных.Когда добавляется новая запись (через AJAX), я пытаюсь перезагрузить таблицу в случае успеха.Я получаю сообщение об ошибке «oTable не определен» всякий раз, когда я пытаюсь вызвать oTable.fnDraw () или oTable.fnReloadAjax ().Что я делаю не так?

Я пробовал и fnDraw (), и fnReloadAjax (), и оба возвращают одну и ту же ошибку.

$(document).ready(function(){
    var oTable = $('.admin_users').dataTable({
        "bProcessing": true,
        "sAjaxSource": 'sql/admin_users.php',       
        "aaSorting": [[ 0, "asc" ]],
        "bJQueryUI": true,
        "sPaginationType": "full_numbers",
        // "sAjaxSource": 'SQL/dataTable.php',
        "bStateSave": true, //Use a cookie to save current display of items
        "aoColumns": [
            null,
            null,
            null,
            null,
            { "sType": "date", "sClass":"center" }
        ],
        "bScrollCollapse": true,
        "sScrollX": "100%"
        });
    oTable.fnAdjustColumnSizing();

Кнопка ручного перерисовки:

$('#click_me').click( function () {
    oTable.fnDraw();
    //oTables.fnReloadAjax();
});

Answer 1

oTable - ссылка на локальную переменную для данных, которая недопустима вне функции готовности документа.

Сделайте это вместо:

  $('#click_me').click( function () {
        $('.admin_users').dataTable().fnReloadAjax();
    } );

Answer 2

`Этот код работает для меня ...

$(document).ready(function(){
    var oTable = $('#MyTab').dataTable({....});

    $('#btnRefresh').click( function () {
       oTable.fnDraw();
    } );
}`

Answer 3

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

1. Создать новый объект в глобальной области видимости.
2. Все другие функции и переменные, специфичные для моего приложения, находятся в этом объекте. Техника - это просто пространство имен через объект
3. Обеспечить правильное упорядочение сценариев: сначала jQuery, затем любые другие сторонние плагины, затем сценарии приложений; вызывать функцию готовности документа (если она используется) только в конце всего этого.

Пример создания пространства имен с объектом:

var myApp = myApp || {}; // create it if the variable isn't already being used

myApp.oTable = $('#admin_users').dataTable({ parameters });

myApp.someUtilityFunction = function(foo) { alert(foo) };

Кроме того, вы можете видеть, что я использую идентификатор для моей таблицы данных в приведенном выше примере. Селектор - это селектор, так что ваш будет работать, но в любом случае он всегда будет уникальной таблицей, поэтому селектор идентификаторов немного эффективнее. Я также не уверен на 100%, работает ли dataTable () только на первом узле, возвращенном селектором, или нет (я надеюсь!), Что является потенциальной проблемой.

Имея это, вы можете без страха связать свой щелчок в документе:

$(function() {
  $('#click_me').click( function () {
    myApp.oTable.fnReloadAjax(); // if script is available
  });
});

Кроме того, если #click_me когда-либо рискует быть уничтоженным (например, если вы находитесь внутри перерисовываемой таблицы!), Лучше использовать .delegate () (jQuery 1.6.x) или .on () (1,7 и выше)

Answer 4

Вы можете перезагрузить таблицу данных, используя метод datatable ajax.reload. Попробуйте это.

$('#click_me').click( function () {
    oTable.ajax.reload();
});

Answer 5

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

 - $("#tableToCallEvent").find('.sorting').eq(0).click();

вы можете изменить значение eq (0), где 0 - индекс первого столбца tbody внутри таблицы

Просто и легко:)

Answer 6

oTable - ссылка локальной переменной на таблицу данных, которая недопустима вне функции готовности документа.

Да, вы можете.

var oTable;
$(document).ready(function() {

    oTable = $('.admin_users').dataTable({
    });
});

$('[name=insert]').live('click', function(){

    $DT.RowInsert(this);
    oTable.fnReloadAjax();
    return false;
});