我對使用 JSON 物件的 dataTable 有疑問，這是列定義：
$(document).ready(function() {
$('#tb_kehadiran').DataTable({
processing: true,
serverSide: true,
scrollX: true,
order: [], //init datatable not ordering
ajax: "<?php echo site_url('ajax-readabsen')?>",
columns: [
{data: 'no', orderable:false},
{data: 'abs_hari'},
{data: 'abs_tgl'},
{data: 'abs_datang', orderable:false},
{data: 'abs_pulang', orderable:false},
{data: 'abs_status'},
]
});
});
我想將兩個物件值組合在一行中，我嘗試這樣做：
{data: 'abs_hari'} " " {data: 'abs_tgl'},
但它不起作用，
你能幫我解決這個問題嗎？
感謝您的任何想法。
uj5u.com熱心網友回復：
你有幾個選擇來做到這一點。
1.ajax.dataSrc選項：
使用此選項，您可以在將 ajax 接收到的資料用作表的源之前對其進行操作。然后您回傳將成為新源的新資料：
$(document).ready(function() {
$('#tb_kehadiran').DataTable({
processing: true,
serverSide: true,
scrollX: true,
order: [], //init datatable not ordering
ajax: {
url: "<?php echo site_url('ajax-readabsen')?>",
dataSrc: function(originalJson) {
// run logic to manipulate your originalJson.
// Combine, split, do whatever you want.
// For example, create a new field
// combining the data of 'abs_hari' and 'abs_tgl'
// and call it 'abs_my_new_data_hari_tgl'.
return newJson; // <- this will be the new data source for your table
},
},
columns: [
{data: 'no', orderable:false},
// {data: 'abs_hari'},
// {data: 'abs_tgl'},
{data: 'abs_my_new_hari_tgl_data_src'},
{data: 'abs_datang', orderable:false},
{data: 'abs_pulang', orderable:false},
{data: 'abs_status'},
]
});
});
2.columns.render選項：
使用自定義函式在表格的特定列中呈現資料：
$(document).ready(function() {
$('#tb_kehadiran').DataTable({
processing: true,
serverSide: true,
scrollX: true,
order: [], //init datatable not ordering
ajax: "<?php echo site_url('ajax-readabsen')?>",
columns: [
{data: 'no', orderable:false},
// {data: 'abs_hari'},
// {data: 'abs_tgl'},
{
data: null, // can be null but also one of your data field i.e. 'abs_hari'
render: myCustomRenderFunction
},
{data: 'abs_datang', orderable:false},
{data: 'abs_pulang', orderable:false},
{data: 'abs_status'},
]
});
});
// define a render function
function myCustomRenderFunction(data, type, row, meta) {
if(type === 'display') {
return row['abs_hari'] " " row['abs_tgl'] // this is used to display in the table
} else {
return data; // original data of the cell from your source. this is used for functionalities other than display (like sorting, odering)
}
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/467658.html
上一篇：訪問值屬性資料