list.pt
3.63 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
<div metal:use-macro="load: base.pt">
<!-- content -->
<div metal:fill-slot="content">
<div class="jarviswidget" style="border-top:1px solid #ccc!important">
<div role="content">
<table id="table1" class="table table-bordered table-hover table-condensed">
<thead>
<tr>
<th tal:repeat="f params.columns">${f.title}</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
</div>
<div class="row">
<table tal:condition="'spm_kode' in request.session">
<tr>
<th>SPM</th>
</tr>
<tr>
<td>${request.session['spm_kode']}</td>
</tr>
</table>
</div>
<!-- end content -->
<script type="text/javascript" metal:fill-slot="scripts">
var mID;
var oTable;
var oTableUri = "${request._host}${params.route}"
var oTableUrl = oTableUri + "/grid/act";
$(document).ready(function() {
oTable = $('#table1').DataTable({
dom: '<"row"<"col-md-8"<"toolbar">l><"col-md-4"f>>rtip',
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]
],
columns: ${params.column_data},
columnDefs: [{
searchable: false,
visible: false,
targets: [0]
}],
"language": {
"search": "Cari : ",
"paginate": {
"first": "Pertama ",
"last": "Akhir ",
"previous": "",
"next": "",
},
"lengthMenu": "Tampil _MENU_ baris "
},
});
var buttons=${params.buttons};
var tb_array=[];
tb_array.push('<div class="btn-group pull-left">');
for (i=0; i<buttons.length; i++){
tb_array.push('<button id="'+buttons[i].id+'" class="' +buttons[i].cls+
'" type="button">'+buttons[i].title+'</button>')
}
tb_array.push(' ');
tb_array.push('</div>');
var tb = tb_array.join(' ');
$("div.toolbar").html(tb);
$("div.toolbar").attr('style', 'display:block; float: left; margin-bottom:6px; line-height:16px;');
//events
$('#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.id;
console.log(mID);
oTable.$('tr.row_selected').removeClass('row_selected');
$(this).addClass('row_selected');
/*oTable2.fnReloadAjax("egaji/grid2?id=" + mID);*/
}
});
${params.scripts}
});
</script>
</div>