【问题标题】:ajax success function not working on datatableajax成功功能不适用于数据表
【发布时间】:2017-05-13 16:50:43
【问题描述】:

我正在使用数据表来显示数据库 mysql 中的列表

我需要在表格加载结束时更新一些输入,然后我正在使用成功功能,但这似乎会阻止数据呈现

var table = $('#example').DataTable({
'processing': true,
'serverSide': true,
'ajax': {
  type: 'POST',
  'url': url,
  'data': function (d) {
    console.log(d.order);
    return JSON.stringify( d );
  },

  // EDIT this "my" success function
  success: function( data ) {
    $('#my_input').val(data.return);
  }
}

返回的Json是:

{
 "data":[[ (datatable value) ]],
 "returned":"myvalue"
}

这里是 jsfiddle

编辑 http://jsfiddle.net/ntcwust8/95/

【问题讨论】:

  • 只删除成功回调
  • 成功回调中的 data.return 是什么。如我所见,从此链接json-generator.com/api/json/get/cbEfqLwFaq?indent=2返回的json中没有这样的字段
  • 我的 json 有一个 data.returned... 或者无论如何我需要在表加载后更新输入

标签: javascript jquery ajax datatables


【解决方案1】:

Datatable 有自己的 complete 事件,称为 initComplete

如果您重新定义 success,您将覆盖 Datatable 自己的函数。

var table = $('#example').DataTable({
    'processing': true,
    'serverSide': true,
    'ajax': {
    ....
    ....
    },    
   'initComplete':function(settings, json){
        alert($('#example tbody tr').length+ ' records on screen');
 });

参考:https://datatables.net/reference/option/initComplete

更新文件:http://jsfiddle.net/ntcwust8/94/

【讨论】:

  • 对不起我的英语,但我需要在每次重新加载时使用从 json 返回的数据更新输入值...查看我的 EDIT 成功函数
  • @FireFoxII initComplete 函数获得一个 json 变量,该变量是一个包含来自 ajax 调用的数据的对象。你可以像json.data一样访问它,这是一个包含所有数据的数组。
  • 是的,但当我调用 table.ajax.reload(); 时似乎不起作用;
  • @FireFoxII when you do ajax.reload Processing... text never hides ,所以,我认为其他地方有错误。
【解决方案2】:

只需删除 success 回调即可。

success - 不能被覆盖,因为它在内部使用 数据表。操作/转换服务器返回的数据 使用 ajax.dataSrc(上),或者使用 ajax 作为函数

Datatable 默认处理success 回调,不要覆盖它。

而是使用AJAXcomplete 选项在数据加载后做一些事情。

更新fiddle

【讨论】:

  • 对不起我的英语,但我需要使用从 json 返回的数据更新输入值...查看我的 EDIT 成功函数
  • 是的,您可以使用响应来做任何您想做的事情。在此处查看更新的小提琴
  • Complete 每次调用 ajax 时都会起作用。
【解决方案3】:

您只需要删除成功回调。

var table = $('#example').DataTable({
        'processing': true,
        'serverSide': true,
        'ajax': {
          type: 'POST',
          'url': url,
          'data': function (d) {
            console.log(d.order);
            return JSON.stringify( d );
          }
        }

编辑

您需要使用 ajax.dataSrc 属性,它将在 ajax 完成后调用。 它也适用于刷新 https://datatables.net/reference/option/ajax.dataSrc

var table = $('#example').DataTable({
    'ajax': {
      type: 'POST',
      'url': url,
      'data': function (d) {
        console.log(d.order);
        return JSON.stringify( d );
      },
      "dataSrc": function (json) {
       $("#mydata").val(json.recordsTotal);
       return json.data;
        }
    },

  });

这里是更新的小提琴。 http://jsfiddle.net/2jkg3kqo/2/

【讨论】:

  • 对不起我的英语,但我需要使用从 json 返回的数据更新输入值...查看我的 EDIT 成功函数
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2015-11-27
  • 1970-01-01
  • 2018-05-31
  • 1970-01-01
  • 2021-11-18
相关资源
最近更新 更多