【问题标题】:Add parameter to datatable ajax call before draw在绘制之前将参数添加到数据表 ajax 调用
【发布时间】:2015-03-06 19:50:05
【问题描述】:

我正在使用 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(); 
})

【问题讨论】:

  • 为什么不在通话中使用$_GET?将$_GET中的参数发送给服务器,服务器进行相应处理。如果没有代码示例,很难说出你在问什么。
  • 我不确定你是否理解这个问题,我想弄清楚在表初始化后如何将参数发送到服务器。
  • 再次,请提供一些 .js 代码来说明您如何初始化数据表。此外,您似乎正在使用旧版数据表;您会发现更新的数据表更易于使用。
  • 我添加了我的代码,上面的代码运行良好,它试图在点击时发送新参数,这就是问题所在。

标签: jquery datatables


【解决方案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();
 });

【讨论】:

  • 这也不起作用。我试图将 me.data 更改为 table.data,因为我超出了范围,但不行。
  • 如果我希望将新参数作为自定义 vm 对象发布为操作的第二个参数怎么办?
【解决方案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/');
    // ...
)};

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

【讨论】:

  • 那个解决方案很简单
【解决方案3】:

如果你使用GET,在初始化数据表后,你可以使用函数url和load来指定不同的url

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

【讨论】:

    【解决方案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(),
        });
      },
    },

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2017-12-26
      • 1970-01-01
      • 1970-01-01
      • 2015-05-05
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多