DataTables - ajax.reload()上的新AJAX参数

时间:2015-03-05 17:15:49

标签: jquery ajax datatables

我正在使用DataTables(Great插件)来创建列表。

我正在使用的AJAX网址包含最后嵌套的变量。

 "ajax": "ajax/appointments/cancelled.php?appointment_date="+localStorage['ajaxDate'],

其中localStorage ['ajaxDate'] =今天的日期

这是我的完整数据表代码:

var table = $('#cancelled_table').DataTable( {
        "ajax": "ajax/appointments/cancelled.php?clinic_id=<? echo $clinic_id ?>&appointment_date="+localStorage['ajaxDate'],
        "columns": [
            {
                "className":      'details-control',
                "orderable":      false,
                "data":           null,
                "defaultContent": ''
            },
            { "data": "time" },
            { "data": "first" },
            { "data": "last" },
            { "data": "petname" },
            { "data": "apt" },
            { "data": "species" },
            { "data": "phone" },
            { "data": "status" },                                               
            { "data": "button" }

        ],
        "order": [[1, 'asc']]
    } );

    // Add event listener for opening and closing details
    $('#cancelled_table tbody').on('click', 'td.details-control', function () {
        var tr = $(this).closest('tr');
        var row = table.row( tr );

        if ( row.child.isShown() ) {
            // This row is already open - close it
            row.child.hide();
            tr.removeClass('shown');
        }
        else {
            // Open this row
            row.child( format(row.data()) ).show();
            tr.addClass('shown');
        }
    } );    

当数据库信息更改时,我可以重绘此表:

cancelledTable.ajax.reload();   

单击“下一天”时会触发上述代码.localStorage ['ajaxDate'] var增加1。

问题是:当重新加载ajax时,它不会使用新的localStorage ['ajaxDate']作为日期。

我会发布我尝试的内容,但我对如何获取cancelledTable.ajax.reload()以查看嵌套在url中的变量已经发生变化没有一个想法。

有什么想法吗? 谢谢

1 个答案:

答案 0 :(得分:1)

可以通过多种方式完成,其中一种方式如下所示。为简洁起见,我省略了代码的某些部分。

var table = $('#cancelled_table').DataTable({
   "ajax": {
       "data": function(){
          $('#cancelled_table').DataTable().ajax.url(
              "ajax/appointments/cancelled.php"
              + "?clinic_id=<? echo $clinic_id ?>"
              + "&appointment_date=" + localStorage['ajaxDate']
          );
       }
   },
   "columns": [
      // ...
   ]
});

当数据库信息发生变化时,我假设您更新了localStorage['ajaxDate']中的数据。然后你需要打电话:

table.ajax.reload();

这将导致调用ajax.data选项中指定的函数。此回调函数使用localStorage['ajaxDate']中的当前值并更新Ajax请求的URL。