 |
| DataTable |
Controllers
function get_data() {
$list = $this->daftar_m->daftar();
$data = array();
$i = 1;
$no = 1;
foreach ($list as $row) { //ini kalau datanya dari database
$row = array();
$row[] = $no;
$row[] = $row->nama;
$row[] = $row->skpd; $row[] = $row->deviasi. "%";
$data[] = $row;
$no++;
}
$output = array(
//"recordsTotal" => 10,
"data" => $data,
);
echo json_encode($output);
}
Models
//query kamu di model daftar_m
View
<table class="table table-bordered table-striped" id="table">
<thead>
<tr>
<th style="vertical-align: middle" class="text-center" width="5%">NO.</th>
<th style="vertical-align: middle" class="text-center" width="40%">NAMA</th>
<th style="vertical-align: middle" class="text-center" width="45%">SKPD</th>
<th style="vertical-align: middle; background: transparent !important;" class="text-center" width="10%;">DEVIASI</th>
</tr>
</thead>
</table>
JavaScript
var oTable = $('#table').DataTable({
"ajax": {
"url": "<?php echo site_url('controller/get_data') ?>",
"type": "POST"
},
"processing": true,
columnDefs: [
{
targets: 3,//kolom ke 4 index pertama 0
render: function (data, type, row) {//merubah tipe output text
return '<input type="text" name="dev[]" class="form-control" value="' + data + '">';
}
}
],
"aoColumns": [//sortable dan styling di setiap kolom
{
"bSortable": true,
"className": "text-center"
},
{
"bSortable": true
},
{
"bSortable": false
},
{
"bSortable": false,
"className": "text-center excellent",
}
],
"paging": false,//show hide dropdown pages
"ordering": true,
"bFilter": true,//enable disable fitur pencarian
"iDisplayLength": 10,
"language": {
"zeroRecords": "Maaf data tidak ditemukan!",
"sSearch": "Cari",
"searchPlaceholder": "Keyword" //placeholder
},
columns: [//deklarasi thead
{title: "No."},
{title: "Nama"},
{title: "SKPD"},
{title: "Deviasi"}
]
});
Sekian, terimakasih atas kunjungannya.
Salam,
PHP Aku : Membangun web terorganisasi dan mudah dimengerti, contoh tutorial dengan menggunakan HTML, CSS, JavaScript, SQL, PHP, dan XML.
EmoticonEmoticon