Jqgrid 如何实施我自己的“计划”；onCellClick"；事件处理程序
在我的JQGrid中，我有复选框列，下拉列表是通过edittype创建的：“select”，复选框是通过“custom formatter”创建的，如edittype:“checkbox”，formatter:returnCheckBox，我想写我自己的“onChange”事件 因此，我能够为复选框编写“onchange”事件，它工作正常，但当我在复选框单元格中单击其他位置（不在复选框上）并单击复选框上的后退时，它停止触发“onchange”事件。我认为行选择它会导致如何停止它的问题 这就是我正在做的Jqgrid 如何实施我自己的“计划”；onCellClick"；事件处理程序,jqgrid,Jqgrid,在我的JQGrid中，我有复选框列，下拉列表是通过edittype创建的：“select”，复选框是通过“custom formatter”创建的，如edittype:“checkbox”，formatter:returnCheckBox，我想写我自己的“onChange”事件 因此，我能够为复选框编写“onchange”事件，它工作正常，但当我在复选框单元格中单击其他位置（不在复选框上）并单击复选框上的后退时，它停止触发“onchange”事件。我认为行选择它会导致如何停止它的问题 这就是我正
$("#theGrid").jqGrid({
datatype: 'local',
sortname: 'value1',
sortorder: 'desc',
cellsubmit: 'clientArray',
editurl: 'clientArray',
cellEdit: true,
colNames: ['SName', 'SType', 'DName', 'DType', 'Nullable'],
colModel: [
{ name: 'SName', index: 'SName', width: 100 },
{ name: 'SType', index: 'Type', width: 100 },
{
name: 'DName',
index: 'DName',
width: 100,
editable: true,
edittype: 'select',
editoptions: { value: "1:ID;2:Name" },
},
{
name: 'DType',
index: 'DType',
width: 100,
editable: true,
edittype: 'select',
editoptions: { value: "1:BigInt;2:VarChar(50)" }
},
{
name: 'Nullable',
index: 'Nullable',
width: 100,
editable: true,
edittype: 'checkbox',
//formatter: "checkbox",
formatter: checkedStateChange,
sortable: false,
formatoptions: {disabled : false},
}
]
});
var gridData = [
{ SName: 'ID', SType: 'BigInt', DName: 'ID', DType: 'BigInt' },
{ SName: 'Name', SType: 'VarChar(50)', DName: 'Name', DType: 'VarChar(50)' },
];
for (var i = 0; i < gridData.length; i++) {
$("#theGrid").jqGrid('addRowData', gridData[i].value0, gridData[i]);
}
function checkedStateChange(cellvalue, options, rowObject) {
return '<input type="checkbox" class="gridCheckBox"/>';
}
$('.gridCheckBox').on('change',function(){
alert('I am in checkBoxChange method');
});
$（“#网格”）.jqGrid({
数据类型：“本地”，
sortname:'value1'，
排序器：“desc”，
cellsubmit:'客户端阵列'，
editurl:'客户端阵列'，
是的，
colname:['SName'，'SType'，'DName'，'DType'，'Nullable']，
colModel：[
{名称：'SName'，索引：'SName'，宽度：100}，
{name:'SType'，index:'Type'，width:100}，
{
名称：“DName”，
索引：“DName”，
宽度：100，
是的，
edittype:'选择'，
编辑选项：{value:“1:ID；2:Name”}，
},
{
名称：“数据类型”，
索引：“数据类型”，
宽度：100，
是的，
edittype:'选择'，
editoptions:{value:“1:BigInt；2:VarChar（50）”}
},
{
名称：“可空”，
索引：“可空”，
宽度：100，
是的，
edittype:“复选框”，
//格式化程序：“复选框”，
格式化程序：checkedStateChange，
可排序：false，
formatoptions:{已禁用：false}，
}
]
});
变量gridData=[
{SName:'ID'，SType:'BigInt'，DName:'ID'，DType:'BigInt'}，
{SName:'Name'，SType:'VarChar（50）”，DName:'Name'，DType:'VarChar（50）}，
];
对于（var i=0；ichangechangeloadComplete仅将事件更改为页面上现有的复选框。例如，通过对网格进行排序，将重建网格内容并创建新的复选框。因此，所有旧的绑定都不会更有效。下一个问题是由于单元格编辑而修改复选框。如果在单元格中单击复选框，则旧内容将被销毁，并在同一位置创建另一个复选框。该复选框将没有change
绑定。用户单击另一个单元格后，将保存当前单元格。因此，编辑复选框将被销毁，新复选框将在与格式化程序相关的同一位置创建：“复选框”
或格式化程序：checkedStateChange
。因此，change
事件处理程序将出现在复选框上
我个人认为没有任何理由将formatter:checkedStateChange
（或formatter:checkbox“
与formattoptions:{disabled:false}
）与单元格编辑一起使用。它只会制造问题。更进一步的结果是使用formatter:“checkbox”
而不使用formattoptions:{disabled:false}
，并且只使用单元格编辑的回调而不是“onchange”事件
代码中的其他问题：
name:'SType'，index:'Type'
的用法是错误的，因为index
值必须与name
值相同，以防使用datatype:“local”
。当前设置不会在列SType
中进行正确排序或搜索。我强烈建议您从colModel
- 您在
DType
列中使用了editoptions:{value:“1:BigInt；2:VarChar（50）”}
，这似乎是错误的。正确的值应该是editoptions:{value:“BigInt:BigInt；VarChar（50）：VarChar（50）”}
。如果需要使用value:“1:BigInt；2:VarChar（50）”
则输入数据应在DType
列中包含1
和2
值，并应另外使用
- 您可以删除
colNames
选项，因为它包含与colModel
的name
属性相同的值
- 决不能使用循环中调用的
addRowData
将数据填充到网格中。相反，您应该在创建jqGrid之前移动gridData
的定义，并在网格中包含data:gridData
选项
- 网格没有寻呼机。尽管如此，本地寻呼仍然可以工作，寻呼机站点是20（这是该选项的默认值）。使用
addRowData
可以填充更多的es 20行，但是如果用户在开始单元格编辑之前单击列标题，则网格将被排序，并且只显示结果的前20行。如果您想使用本地分页，您必须包括一个具有足够大值的rowNum
选项，如rowNum:10000
- 这是严格的建议