anugrast
|
|
« on: October 13, 2016, 08:28:17 PM » |
|
Hai... I want to make datagrid with checkbox facilities. Here are some of my questions. - Can I add onchange action on the checkbox to make some checkbox disabled which have some condition
This is my JS $('#dgIEIRSmhs').datagrid({ url:'_modul/mod_irs/aksi_irs.php?act=listJADKULKRS',method:'post',striped:true,loadMsg:'Loading',showHeader:true,rownumbers:true,rownumberWidth:40,remoteSort:false,multiSort:true, singleSelect:true, ctrlSelect:true, checkOnSelect:false, selectOnCheck:false, columns:[[ {field:'hari',title:'Hari',width:60,align:'center',formatter:formatNamaHari,sortable:true}, {field:'jamkul',title:'J a m',width:85,align:'center',sortable:true}, {field:'kodemk',title:'Kode MK',width:85,align:'center',sortable:true}, {field:'namamk',title:'Nama Mata Kuliah',width:190,align:'left',sortable:true}, {field:'semester',title:'SMT',width:40,align:'center'}, {field:'sks',title:'SKS',width:40,align:'center'}, {field:'nama_kelas',title:'Kelas',width:40,align:'center'}, {field:'namados',title:'Dosen',width:190,align:'left',sortable:true}, {field:'ruang',title:'Ruang',width:70,align:'center',sortable:true}, {field:'ambil',title:'Ambil',width:60,align:'center', formatter: function (value) { if (value == 1) { return '<input type="checkbox" checked>'; } else { return '<input type="checkbox" >'; } } } ]], rowStyler: function(index,row){ if(row.ambil==1) { return 'background-color:#6293BB;color:#fff;'; } } });
Please help me...
|
|
« Last Edit: October 13, 2016, 09:33:16 PM by anugrast »
|
Logged
|
|
|
|
stworthy
|
|
« Reply #1 on: October 14, 2016, 12:29:59 AM » |
|
The datagrid has a built-in checkbox column. The code below shows how to hide some checkbox elements when the list price is less than 30. <style> .r1 .datagrid-cell-check input{ display: none; } </style> <script> $(function(){ $('#dg').datagrid({ rowStyler: function(index,row){ if (row.listprice<30){ return { class: 'r1' } } }, onCheck: function(index,row){ //... }, onUncheck: function(index,row){ //... } }); }) </script>
|
|
|
Logged
|
|
|
|
anugrast
|
|
« Reply #2 on: October 14, 2016, 06:34:09 PM » |
|
Thanks sworty... I've tried... This is my code... $('#dgIEIRSmhs').datagrid({ url:'_modul/mod_irs/aksi_irs.php?act=listJADKULKRS',method:'post',striped:true,loadMsg:'Loading',showHeader:true,rownumbers:true,rownumberWidth:40,remoteSort:false,multiSort:true, singleSelect:true, ctrlSelect:true, checkOnSelect:false, selectOnCheck:false, columns:[[ {field:'hari',title:'Hari',width:60,align:'center',formatter:formatNamaHari,sortable:true}, {field:'jamkul',title:'J a m',width:85,align:'center',sortable:true}, {field:'kodemk',title:'Kode MK',width:85,align:'center',sortable:true}, {field:'namamk',title:'Nama Mata Kuliah',width:190,align:'left',sortable:true}, {field:'semester',title:'SMT',width:40,align:'center'}, {field:'sks',title:'SKS',width:40,align:'center'}, {field:'nama_kelas',title:'Kelas',width:40,align:'center'}, {field:'namados',title:'Dosen',width:190,align:'left',sortable:true}, {field:'ruang',title:'Ruang',width:70,align:'center',sortable:true}, {field:'ambil',checkbox:true,width:50} ]], rowStyler: function(index,row){ if(row.ambil) { return 'background-color:#6293BB;color:#fff;'; } }, onLoadSuccess: function(data){ for(var i=0; i<data.rows.length; i++){ if(data.rows[i]['ambil']) { $(this).datagrid('checkRow', i); } } }, onCheck: function(index,row){ row.ambil=1; //alert(row.ambil); }, onUncheck: function(index,row){ row.ambil=0; //alert(row.ambil); } });
When I check th checkbox, my row background color didn't change... How to fix it? Thx
|
|
|
Logged
|
|
|
|
stworthy
|
|
« Reply #3 on: October 15, 2016, 02:05:24 AM » |
|
Please call 'refreshRow' method when changing the row value. onCheck: function(index,row){ row.ambil = 1; $(this).datagrid('refreshRow', index); }, onUncheck: function(index,row){ row.ambil = 0; $(this).datagrid('refreshRow', index); }
|
|
|
Logged
|
|
|
|
anugrast
|
|
« Reply #4 on: October 15, 2016, 06:23:10 PM » |
|
Thanks for your help... It works....
|
|
|
Logged
|
|
|
|
|