2016-10-19 110 views
0

我正在使用jQuery數據表通過Ajax和SQL輸出數據。我可以很好地輸出數據。但是,我想將兩個返回對象合併到一個列中,因爲它與屬於同一事物有關。在一個AJAX數據表列中顯示兩個對象

$('#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我想只是在標有 '詳細信息' 一個單列。我可以找出如何做單列,但無法弄清楚如何做一個以上的只有一列

例預期成果:

<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> 
+0

返回結果是一個JSON對象嗎? – Anson

+0

是的。我將編輯我的答案,以顯示從我的SQL對象轉儲的正確JSON響應。 – Lynx

+0

你能提供你期望的結果嗎? – Anson

回答

0

你應該能夠做到這一點使用的渲染器( 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; 
        } 
     } 
    ] 
}); 

我用最後一列對於這個例子。行參數應該包含原始的json對象。

相關問題