Question

我添加了服务器端jQuery数据表，来自后端的数据正确地用于所有分页，排序等，并且还第一次绑定数据，但第二次没有用新数据替换数据表的内容。

这是我的JQuery代码：

var table = $('#example').DataTable({
  "processing": true,
  "serverSide": true,                
  "ajax":
  {
    "url": "View_account.aspx/GetData",
    "contentType": "application/json",
    "type": "GET",
    "dataType": "JSON",
    "data": function (d) {
      return d;
    },
    "dataSrc": function (json) {
      json.draw = json.d.draw;
      json.recordsTotal = json.d.recordsTotal;
      json.recordsFiltered = json.d.recordsFiltered;
      json.data = json.d.data;
      var return_data = json;
      return return_data.data;
    }
  },
  "columns": [
    {
      "data": "tblRow",
      "render": function (data, type, row) {
        console.log(data)
        return data;
      }
    },
    { data: "cust_name" },
    { data: "status" },
    {
      data: "account_id",
      "render": function (data, type, row) {
        console.log(data)
        return '<td><a href="Add_Account.aspx?account_id=' + row.account_id + '"><i class="fa fa-pencil edt_icn" aria-hidden="true"></i></a></td>';
      }

    },
    {
      data: "account_id",
      "render": function (data, type, row) {
        console.log(data)
        return '<a href="#" onclick="deleteproject(\'' + row.account_id + '\' ,\'' + row + '\')"><i class="fa fa-trash delet_wrpr delt_icn" aria-hidden="true"></i></a>';
      }
    },
    {
      data: ".account_id",
      "render": function (data, type, row) {
        console.log(data)
        return "<input value='" + row.account_id + "' id='record" + row.account_id + "' name='record" + row.account_id + "' type='checkbox'>";
      }
    }
  ]
});

请帮助。先感谢您。

Answer 1

尝试使用"columnDefs"（datatables example）道具代替"columns"：

var table = $('#example').DataTable({
  "processing": true,
  "serverSide": true,                
  "ajax":
  {
    "url": "View_account.aspx/GetData",
    "contentType": "application/json",
    "type": "GET",
    "dataType": "JSON",
    "data": function (d) {
      return d;
    },
    "dataSrc": function (json) {
      json.draw = json.d.draw;
      json.recordsTotal = json.d.recordsTotal;
      json.recordsFiltered = json.d.recordsFiltered;
      json.data = json.d.data;
      var return_data = json;
      return return_data.data;
    }
  },
  // HERE CHANGE
  "columnDefs": [
    {
      // HERE CHANGE ( COLUMN INDEX)  
      "targets": 0,
      "render": function (data, type, row) {
        console.log(data)
        return data;
      }
    },
    {
      "targets": 3,
      "render": function (data, type, row) {
        console.log(data)
        return '<td><a href="Add_Account.aspx?account_id=' + row.account_id + '"><i class="fa fa-pencil edt_icn" aria-hidden="true"></i></a></td>';
      }

    },
    {
      "targets": 4,
      "render": function (data, type, row) {
        console.log(data)
        return '<a href="#" onclick="deleteproject(\'' + row.account_id + '\' ,\'' + row + '\')"><i class="fa fa-trash delet_wrpr delt_icn" aria-hidden="true"></i></a>';
      }
    },
    {
      "targets": 5,
      "render": function (data, type, row) {
        console.log(data)
        return "<input value='" + row.account_id + "' id='record" + row.account_id + "' name='record" + row.account_id + "' type='checkbox'>";
      }
    }
  ]
});

jquery服务器端数据表无法正常运行

1 个答案: