Question

我正在使用jQuery数据表通过Ajax和SQL输出数据。我可以很好地输出数据。但是，我想将两个返回对象组合成一个列，因为它属于同一个东西。

$('#todayApt').on('show.bs.modal', function (event){
    $('#todayAptList').DataTable( {
        "ajax": {
            "url": '{{ url('panel/appointment/ajax/schedule/week/lookup') }}',
            dataSrc: ''
        },
        "columns": [
            { "data": "date" },
            { "data": "office" },
            { "data": "block" },
            { "data": "last_name" },
            { "data": "street_1" },
            { "data": "zip_code" },
            { "data": "phone_1" },
            { "data": "service_detail" }
        ]
    } );
});

我的目标如下：

[  
   {  
      "street_1":"1234 Main St",
      "phone_2":"(555) 555-5555",
      "street_2":null,
      "date":"2016-10-19",
      "users_info_id":19,
      "last_name":"Doe",
      "phone_1":"(555) 555-5555",
      "zip_code":90210,
      "status":"scheduled",
      "office":"location",
      "block":"9-12",
      "special_detail":null,
      "mp_detail":null,
      "service_detail":"Service Details"
   }
]

所以service_detail，mp_detail和special_detail我想在一个标有＆＃39; Details＆＃39;的列中。我可以弄清楚如何做单列，但无法弄清楚如何只在一列中做多个

预期结果示例：

<table id="todayAptList" class="table table-striped table-bordered dt-responsive" cellspacing="0" width="100%">
    <thead>
    <tr>
        <th>Date</th>
        <th>Office</th>
        <th>Block</th>
        <th>Last Name</th>
        <th>Address</th>
        <th>Zip Code</th>
        <th>Phone</th>
        <th>Services</th>
    </thead>
    <tbody>
   <tr role="row" class="odd">
      <td class="sorting_1" tabindex="0">2016-10-18</td>
      <td>Location</td>
      <td>3-5</td>
      <td>Doe</td>
      <td>1234 Main St</td>
      <td>90210</td>
      <td>(555) 555-5555</td>
      <td>SPECIAL, MP AND SERVICE DETAILS HERE IN ONE</td>
   </tr>
</tbody>

Answer 1

您应该可以使用渲染器（columns.render）执行此操作。见这里参考： DataTable Renderers

基本上，您使用渲染器转换原始对象的数据。您可以在列中找到这样的组合信息（未经测试，但我刚刚修改了一些代码，我今天早些时候做了同样的事情）：

$('#todayApt').on('show.bs.modal', function (event){
$('#todayAptList').DataTable( {
    "ajax": {
        "url": '{{ url('panel/appointment/ajax/schedule/week/lookup') }}',
        dataSrc: ''
    },
    "columns": [
        { "data": "date" },
        { "data": "office" },
        { "data": "block" },
        { "data": "last_name" },
        { "data": "street_1" },
        { "data": "zip_code" },
        { "data": "phone_1" },
        { 
            "data": null, 
            render: function (data, type, row) {
                        var details = row.service_detail + " " + row.mp_detail + " " + row.special_detail;
                        return details;
                    }
        }
    ]
});

我在本例中使用了最后一列。 row参数应包含原始json对象。

在一个AJAX数据表列中显示两个对象

1 个答案: