free-jqgrid 使用 edittype 编辑列:"checkbox"、editoptions.value:“1:0”不起作用
free-jqgrid editing a column with edittype: "checkbox", editoptions.value: "1:0" doesn't work
在 free-jqgrid 中,当使用 edittype 编辑列时:"checkbox" 和 editoptions.value = "1:0",字段值之前为0,不可能设置为1,勾选字段提交表单时,该列保持未勾选状态
这在 jqGrid 中运行良好。
这种奇怪的行为可以在下面看到 JSFiddle example. ( forked from an OlegK's example )
在此示例中,如果您编辑并选中先前未选中字段的 inCharge 字段,则在提交表单后,它将保持未选中状态。
另一方面,如果勾选了,你可以勾选也可以不勾选,提交后就如愿了。
而且,在添加记录时,如果勾选了inCharge字段,提交后仍然没有勾选。
这是代码
$(function() {
"use strict";
$("#grid").jqGrid({
colModel: [{
name: "id",
width: 20,
hidden: true,
editable: false,
},
{
name: "firstName",
width: 200,
editable: true
},
{
name: "lastName",
width: 200,
editable: true
},
{
name: "inCharge",
width: 100,
editable: true,
formatter: "checkbox",
edittype: "checkbox",
editoptions: {
value: "1:0" // doesn't seem to work properly.
}
}
],
data: [{
id: 10,
firstName: "Angela",
lastName: "Merkel",
inCharge: "1"
},
{
id: 20,
firstName: "Vladimir",
lastName: "Putin",
inCharge: "1"
},
{
id: 30,
firstName: "David",
lastName: "Cameron",
inCharge: "1"
},
{
id: 40,
firstName: "Barack",
lastName: "Obama",
inCharge: "0"
},
{
id: 50,
firstName: "François",
lastName: "Hollande",
inCharge: "0"
}
],
pager: true,
pgbuttons: false,
pginput: false,
viewrecords: true,
pagerRightWidth: 90
})
.jqGrid('navGrid', {
edittext: 'Edit',
addtext: 'Add',
deltext: 'Del',
search: false,
view: true,
viewtext: 'View',
refresh: true,
refreshtext: 'Refresh'
});
});
<link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/themes/redmond/jquery-ui.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.15.4/css/ui.jqgrid.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.15.4/jquery.jqgrid.min.js"></script>
<table id="grid"></table>
您描述的问题是 the issue #432 中描述的表单编辑错误。该问题已在 Git 上的代码中修复。演示
https://jsfiddle.net/OlegKi/dvyo36hw/11/
使用您的原始代码,但是
https://rawgit.com/free-jqgrid/jqGrid/master/js/jquery.jqgrid.min.js
而不是
https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.15.4/jquery.jqgrid.min.js
可以验证问题是否已解决。
在 free-jqgrid 中,当使用 edittype 编辑列时:"checkbox" 和 editoptions.value = "1:0",字段值之前为0,不可能设置为1,勾选字段提交表单时,该列保持未勾选状态
这在 jqGrid 中运行良好。
这种奇怪的行为可以在下面看到 JSFiddle example. ( forked from an OlegK's example )
在此示例中,如果您编辑并选中先前未选中字段的 inCharge 字段,则在提交表单后,它将保持未选中状态。
另一方面,如果勾选了,你可以勾选也可以不勾选,提交后就如愿了。
而且,在添加记录时,如果勾选了inCharge字段,提交后仍然没有勾选。
这是代码
$(function() {
"use strict";
$("#grid").jqGrid({
colModel: [{
name: "id",
width: 20,
hidden: true,
editable: false,
},
{
name: "firstName",
width: 200,
editable: true
},
{
name: "lastName",
width: 200,
editable: true
},
{
name: "inCharge",
width: 100,
editable: true,
formatter: "checkbox",
edittype: "checkbox",
editoptions: {
value: "1:0" // doesn't seem to work properly.
}
}
],
data: [{
id: 10,
firstName: "Angela",
lastName: "Merkel",
inCharge: "1"
},
{
id: 20,
firstName: "Vladimir",
lastName: "Putin",
inCharge: "1"
},
{
id: 30,
firstName: "David",
lastName: "Cameron",
inCharge: "1"
},
{
id: 40,
firstName: "Barack",
lastName: "Obama",
inCharge: "0"
},
{
id: 50,
firstName: "François",
lastName: "Hollande",
inCharge: "0"
}
],
pager: true,
pgbuttons: false,
pginput: false,
viewrecords: true,
pagerRightWidth: 90
})
.jqGrid('navGrid', {
edittext: 'Edit',
addtext: 'Add',
deltext: 'Del',
search: false,
view: true,
viewtext: 'View',
refresh: true,
refreshtext: 'Refresh'
});
});
<link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/themes/redmond/jquery-ui.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.15.4/css/ui.jqgrid.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.15.4/jquery.jqgrid.min.js"></script>
<table id="grid"></table>
您描述的问题是 the issue #432 中描述的表单编辑错误。该问题已在 Git 上的代码中修复。演示
https://jsfiddle.net/OlegKi/dvyo36hw/11/
使用您的原始代码,但是
https://rawgit.com/free-jqgrid/jqGrid/master/js/jquery.jqgrid.min.js
而不是
https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.15.4/jquery.jqgrid.min.js
可以验证问题是否已解决。