list.pt
3.81 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
<html metal:use-macro="load: ../base.pt">
<div metal:fill-slot="content">
<h4>${request.title}</h4>
<hr>
<table id="table1" class="table table-bordered table-hover table-condensed">
<thead>
<tr>
<th>ID</th>
<th>Tanggal</th>
<th>Kode</th>
<th>Uraian</th>
<th>Jumlah</th>
<th>Level</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
<div metal:fill-slot="scripts">
<script>
var mID;
var mThn;
var oTable;
var oTableUri = "/eis/sipkd/ar/payment";
var oTableUrl = oTableUri + "/grid/act";
$(document).ready(function () {
oTable = $('#table1').DataTable({
dom : '<"toolbar">lfrtip',
processing : true,
serverSide : true,
ajax : oTableUrl,
stateSave : true,
scrollCollapse: true,
sort : true,
info : false,
filter : true,
autoWidth : false,
paginate : true,
paginationType: "full_numbers",
lengthMenu: [
[10, 25, 50, 100],
[10, 25, 50, 100]
],
columnDefs: [{
searchable: false,
visible: false,
targets: [0]
}],
columns: [
null,
{"width": "75px"},
{"width": "75px"},
null,
{"width": "75px"},
{"width": "75px", "sClass": "right"},
],
"language": {
"search" : "Cari: ",
"paginate":{
"first" : "Pertama ",
"last" : "Akhir ",
"previous": "Mundur ",
"next" : "Maju ",
},
"lengthMenu": "Tampil _MENU_ baris "
},
});
var tb_array = [
'<div class="btn pull-left">',
' <button id="btn_add" class="btn btn btn-primary" type="button">Tambah</button>',
' <button id="btn_edit" class="btn btn btn-primary" type="button">Edit</button>',
' <button id="btn_delete" class="btn btn btn-danger" type="button">Hapus</button>',
' <button id="btn_csv" class="btn btn btn-default" type="button">CSV</button>',
' <button id="btn_item" class="btn btn btn-warning" type="button">Item data</button>',
' ',
'</div>',
];
var tb = tb_array.join(' ');
$("div.toolbar").html(tb);
$("div.toolbar").attr('style', 'display:block; float: left; margin-bottom:6px; line-height:16px;');
$('#table1 tbody').on('click', 'tr', function () {
if ($(this).hasClass('selected')) {
$(this).removeClass('selected');
} else {
var aData = oTable.row( this ).data();
oTable.$('tr.selected').removeClass('selected');
$(this).addClass('selected');
mID = aData[0];
oTable.$('tr.row_selected').removeClass('row_selected');
$(this).addClass('row_selected');
}
});
$('#btn_add').click(function () {
window.location = oTableUri + '/add';
});
$('#btn_edit').click(function () {
if (mID) window.location = oTableUri + '/'+mID+'/edit';
else alert('Pilih Baris yang akan di edit');
});
$('#btn_delete').click(function () {
if (mID) window.location = oTableUri + '/'+ mID+'/delete';
else alert('Pilih Baris yang akan di hapus');
});
})
</script>
</div>
</html>