In free jqGrid before 4.13
editoptions: {
disabled: false
},
Was used to implement single click checkbox in inline editing. In 4.13 checkbox state is no more restored if clicked in new row without saving.
To reproduce, run code below and click in unchecked closed column to put checkmark into into it. Now click in other row. In 4.13 checkmark still appears in previous row. Before 4.13 checkmark disappers. How to fix this ?
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/redmond/jquery-ui.css">
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
<link rel="stylesheet" href="https://rawgit.com/free-jqgrid/jqGrid/master/css/ui.jqgrid.css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.js"></script>
<script src="http://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script>
<script src="https://rawgit.com/free-jqgrid/jqGrid/master/js/i18n/grid.locale-en.js"></script>
<script type="text/javascript">
$.jgrid.no_legacy_api = true;
$.jgrid.useJSON = true;
</script>
<script src="https://rawgit.com/free-jqgrid/jqGrid/master/js/jquery.jqgrid.src.js"></script>
<script type="text/javascript">
$.extend(true, $.jgrid.defaults, {
multiSort: true,
iconSet: "fontAwesome",
navOptions: {
position: "center"
},
toppager: true,
multiselect: true,
scrollrows: true,
loadui: 'block',
cmTemplate: { autoResizable: true },
autoencode: true,
autoEncodeOnEdit: true,
gridview: true
});
$(document).ready(function () {
'use strict';
var mydata = [
{ id: "1", invdate: "2007-10-01", name: "test", note: "note", amount: "200.00", tax: "10.00", closed: true, ship_via: "TN", total: "210.00" },
{ id: "2", invdate: "2007-10-02", name: "test2", note: "note2", amount: "300.00", tax: "20.00", closed: false, ship_via: "FE", total: "320.00" },
{ id: "3", invdate: "2007-09-01", name: "test3", note: "note3", amount: "400.00", tax: "30.00", closed: false, ship_via: "FE", total: "430.00" },
{ id: "4", invdate: "2007-10-04", name: "test4", note: "note4", amount: "200.00", tax: "10.00", closed: true, ship_via: "TN", total: "210.00" },
{ id: "5", invdate: "2007-10-31", name: "test5", note: "note5", amount: "300.00", tax: "20.00", closed: false, ship_via: "FE", total: "320.00" },
{ id: "6", invdate: "2007-09-06", name: "test6", note: "note6", amount: "400.00", tax: "30.00", closed: false, ship_via: "FE", total: "430.00" },
{ id: "7", invdate: "2007-10-04", name: "test7", note: "note7", amount: "200.00", tax: "10.00", closed: true, ship_via: "TN", total: "210.00" },
{ id: "8", invdate: "2007-10-03", name: "test8", note: "note8", amount: "300.00", tax: "20.00", closed: false, ship_via: "FE", total: "320.00" },
{ id: "9", invdate: "2007-09-01", name: "test9", note: "note9", amount: "400.00", tax: "30.00", closed: false, ship_via: "TN", total: "430.00" },
{ id: "10", invdate: "2007-09-08", name: "test10", note: "note10", amount: "500.00", tax: "30.00", closed: true, ship_via: "TN", total: "530.00" },
{ id: "11", invdate: "2007-09-08", name: "test11", note: "note11", amount: "500.00", tax: "30.00", closed: false, ship_via: "FE", total: "530.00" },
{ id: "12", invdate: "2007-09-10", name: "test12", note: "note12", amount: "500.00", tax: "30.00", closed: false, ship_via: "FE", total: "530.00" }
],
$grid = $("#list")
;
$grid.jqGrid({
datatype: 'local',
data: mydata,
colModel: [
{
name: 'invdate', index: 'invdate', width: 80, align: 'center', editable: true
},
{ name: 'name', index: 'name', editable: true, width: 65, editrules: { required: true } },
{ name: 'amount', index: 'amount', width: 75, editable: true },
{ name: 'tax', index: 'tax', width: 52, editable: true },
{ name: 'total', index: 'total', width: 60, editable: true },
{
template: "booleanCheckbox",
name: 'closed',
editable: true,
editoptions: {
disabled: false
},
},
{
name: 'ship_via', index: 'ship_via', width: 105, align: 'center', editable: true, formatter: 'select',
edittype: 'select', editoptions: { value: 'FE:FedEx;TN:TNT;IN:Intim', defaultValue: 'IN' },
stype: 'select', searchoptions: { sopt: ['eq', 'ne'], value: ':Any;FE:FedEx;TN:TNT;IN:IN' }
},
{ name: 'note', index: 'note', width: 60, sortable: false, editable: true, edittype: 'textarea' }
],
rowNum: 10,
rowList: [5, 10, 20],
pager: '#pager',
gridview: true,
rownumbers: true,
autoencode: true,
ignoreCase: true,
sortname: 'invdate',
viewrecords: true,
sortorder: 'desc',
height: '100%',
editurl: 'clientArray',
beforeSelectRow: function (rowid, e) {
var savedRow = $(this).jqGrid("getGridParam", "savedRow");
if (savedRow.length === 0 || savedRow[0] === undefined) {
$(this).jqGrid('editRow', rowid, true);
return true;
}
if (rowid !== savedRow[0].id) {
$grid.jqGrid('restoreRow', savedRow[0].id);
$(this).jqGrid('editRow', rowid, true);
}
return true;
}
});
});
</script>
</head>
<body>
<table id="list"></table>
<div id="pager"></div>
</body>
