Question

我正在使用DataTables 1.10

有没有人知道如何在table.draw（）之前动态地向ajax调用添加参数，以便我的请求有新的参数？我到处寻找，找不到答案。

我有一个人可以按下的按钮，并根据该按钮向服务器发送不同的参数。

$('#mytable').DataTable({
        iDisplayLength: 10,
        responsive: true,
        processing: true,
        serverSide: true,
        searching: false,
        bLengthChange: false,
        bProcessing: true,
        paging: true,
         ajax: {
            url: me.url,
            dataType: 'json',
            cache:false,
            type: 'GET',
            data: function ( d ) {
                $.extend( d, me.data);
                d.supersearch = $('.my-filter').val();
            }
        },
        columns: me.columns,
        columnDefs: me.renderer,
        initComplete: function() {

        }
    });

这一切都运行正常但我尝试将其绑定到按钮以传递新参数。

$('.button').on('click', function(){
      var table  = $('#mytable').DataTable();
      table.ajax.params({name: 'test'}); <- I want to do something like this
      table.draw(); 
})

Answer 1

我修改了您的代码以满足您的需求。

初始化数据表：

 $('#mytable').DataTable({
    iDisplayLength: 10,
    responsive: true,
    processing: true,
    serverSide: true,
    searching: false,
    bLengthChange: false,
    bProcessing: true,
    paging: true,
    ajax: {
       url: me.url,
       dataType: 'json',
       cache:false,
       type: 'GET',
       data: function ( d ) {
          $.extend(d, me.data);
          d.supersearch = $('.my-filter').val();

          // Retrieve dynamic parameters
          var dt_params = $('#mytable').data('dt_params');
          // Add dynamic parameters to the data object sent to the server
          if(dt_params){ $.extend(d, dt_params); }
       }
    },
    columns: me.columns,
    columnDefs: me.renderer,
    initComplete: function() {

    }
 });

处理按钮上的点击事件：

注意：我假设这是您为AJAX调用添加动态参数的唯一地方。

 $('.button').on('click', function(){
    // Set dynamic parameters for the data table
    $('#mytable').data('dt_params', { name: 'test' });
    // Redraw data table, causes data to be reloaded
    $('#mytable').DataTable().draw();
 });

Answer 2

我的方式不是那么漂亮，但非常简单并且效果很好：当我想在重绘DataTable时传递自定义参数时，首先我只需更改其URL：

$('#table_id').DataTable().ajax.url('/custom/path/with/custom/parameters/inside/');
$('#table_id').DataTable().draw();

然后，如有必要，作为“on draw.dt”事件的第一步，我将其更改回正常的URL：

$('#table_id').on('draw.dt', function() {
    $('#table_id').DataTable().ajax.url('/normal/path/for/ajax/source/');
    // ...
)};

这种方法的唯一缺点是需要一些技巧来将这些自定义参数压缩到备用路径中。此外，还需要一些服务器端的工作来准备备用路由并从中提取这些自定义参数。

Answer 3

如果使用GET，则在初始化数据表后，可以使用函数url并加载以指定其他url

var table = $('#tableId').DataTable();
table.ajax.url( urlFiltros ).load();

Answer 4

从函数返回扩展后我得到了解决方案

"ajax": {
  'type':'POST',
  'url': base_url+'/admin/get_common_search_modal',
  'data': function(data){
    return $.extend( {obj}, data, {
      primary_id: obj.default_primary_id,
      module_name: obj.search_module_name,
      whereNotColumns:obj.whereNotColumns,
      whereNotArr:obj.whereNotArr,
      whereArr:obj.whereArr,
      module_list_name:$('#search_modal #module_list').val(),
    });
  },
},

在绘制之前将参数添加到datatable ajax调用

4 个答案: