使用 datatable ajax 响应数据设置自定义标签值答案

【问题标题】：Use datatable ajax response data to set custom label value使用 datatable ajax 响应数据设置自定义标签值
【发布时间】：2017-09-14 02:02:49
【问题描述】：

我用过server-side processing data table。

这是我的数据表配置：

var table = $("#job-table").DataTable({
    "ajax": {
        "url": "<?php echo url('/getJobs');?>",
        "type": "POST",
        "data": function (d) {
            d.connection = connectionArray,
            d.company = companyArray,
            d.type = typeArray
        }
    },
    "processing": true,
    "serverSide": true,
    "columns": [
        { "data": "id" },
        { "data": "job_id" },
        { "data": "type" },
        { "data": "connection_id" },
        { "data": "company_id" },
        { "data": "message" },
        { "data": "total_completion_time" },
        { "data": "date" },
        { "data": "start_time" },
        { "data": "end_time" },
        { "data": "error_time" }
    ],
    "info":     false,
    "searching": false,
    "bLengthChange": false
});

在这个数据表 ajax 响应中，我传递了一些我将用来设置自定义标签值的数据。

现在，我正在使用相同的 ajax 调用来设置标签值。有两个调用，一个是数据表调用，另一个调用设置标签。两次我都在调用相同的 API。但想知道如何避免第二次 ajax 调用？有没有办法使用数据表ajax调用响应来设置自定义标签值？

【问题讨论】：

"Some another data" 有点模糊。 dataSrc: function(json) { $('#label').html( json.someAnotherData ); return json } 或许能给你一个提示...？
不工作！ :( 我在数据表响应中返回一个参数，即“数据”级别的“avg_number_of_completion” - 我在列内使用了数据我想使用 avg_number_of_completion 来设置标签

标签： javascript jquery ajax datatable datatables

【解决方案1】：

我做类似的事情。我使用 dataFilter 回调来处理它。

所以给定 HTML：

    <input id="txtOne"/>
    <input id="txtTwo"/>
    <table id="job-table" class="display"></table>

服务器端代码返回一个 JSON 序列化对象，如下所示：

{ ValueOne: "some data",
  ValueTwo: "Some more data",
  data: [array of data for the table] }

我的表定义看起来像（注意 dataFilter 部分）：

var table = $("#job-table").DataTable({
    "ajax": {
        "url": "<?php echo url('/getJobs');?>",
        "type": "POST",
        "data": function (d) {
            d.connection = connectionArray,
            d.company = companyArray,
            d.type = typeArray
        },
        // I added this section. It is called before the success callback 
        // You will have to figure out your parsing at this point because 
        // each configuration is different so I just put how mine is.

        dataFilter: function(response){
            var temp = JSON.parse(response);
            $("#txtOne").val(temp.ValueOne);
            $("#txtTwo").val(temp.ValueTwo);


            return response;

        }
    },
    "processing": true,
    "serverSide": true,
    "columns": [
        { "data": "id" },
        { "data": "job_id" },
        { "data": "type" },
        { "data": "connection_id" },
        { "data": "company_id" },
        { "data": "message" },
        { "data": "total_completion_time" },
        { "data": "date" },
        { "data": "start_time" },
        { "data": "end_time" },
        { "data": "error_time" }
    ],
    "info": false,
    "searching": false,
    "bLengthChange": false
});

【讨论】：