jqGrid,编辑模式,序列化多选
使用edittype: select
和multiple: true
编辑列时,jqGrid将数据作为逗号分隔值发送到服务器。 是否可以将某个事件绑定到此特定列,这将返回数组而不是逗号分隔值?
我想避免使用serializeEditData事件,因为
- 这个是特定于网格的,而不是特定于列的,这对我来说是个麻烦 – 我正在尝试将列逻辑与网格逻辑分开
- 将数组转换为字符串并将字符串转换为完全相同的数组听起来不是一个好主意。
我认为您必须在案例中使用edittype: 'custom'
,并提供custom_element
和custom_value
editoptions
方法的自定义实现。 如果需要读取自定义输入元素的值,则jqGrid将使用参数'get'
参数调用custom_value
方法。 您的custom_value
方法的实现可以返回案例中的项数组。
重要的是要理解,一般来说,您需要实现自定义格式化程序,它允许显示多次选择输入的数据数组。 幸运的是formatter: "select"
有一行
cellval = cellval + "";
将数组转换为逗号分隔的项目。 由于该行将通过使用.join(",")
和formatter: "select"
转换为字符串formatter: "select"
成功接受数组作为输入。
演示
演示了上述方法。 它使用以下代码:
{ name: "Subcategory", width: 250, formatter: "select", edittype: "custom", editoptions: { value: {"1": "football", "2": "formula 1", "3": "physics", "4": "mathematics"}, custom_element: function (value, options) { return $.jgrid.createEl.call(this, "select", $.extend(true, {}, options, {custom_element: null, custom_value: null}), value); }, custom_value: function ($elem, operation, value) { if (operation === "get") { return $elem.val(); } }, multiple: true } }
在上面的代码中,我使用$.jgrid.createEl
通过现有的jqGrid代码创建多值选择。 唯一需要做的就是从选项中删除custom_element
和custom_value
,以防止从setAttributes中不必要地调用方法。 如果要修改setAttributes
代码行并在排除属性列表中包含"custom_value"
和"custom_element"
,则表达式$.extend(true, {}, options, {custom_element: null, custom_value: null})
可以减少options
。
在这种方式中,我们得到与使用edittype: "select"
几乎相同的
edittype: "select"
。 只有两个不同之处:
- 在
edittype: "custom"
创建的元素
edittype: "custom"
将具有附加属性class="customelement"
- 在
edittype: "custom"
创建的元素
edittype: "custom"
将在...
内包装(将是直接子项)
在我们的案例中,这种差异似乎并不重要。
更新 : setAttributes
方法的代码现在修复在gtihub上的jqGrid的主代码中(参见建议和提交 )。 因此,在下一版本的jqGrid(更高版本为4.4.1)中,可以将custom_element
的代码减少到
custom_element: function (value, options) { return $.jgrid.createEl.call(this, "select", options, value); }
请参阅相应的演示 。