升级到免费的 jqGrid 4.11 - 使用 edittype:'select' 的内联编辑不会传递 select 选项的值

Upgrade to Free jqGrid 4.11 - inline edit with edittype:'select' does not pass value of the select option

网格定义字段为:

colModel: [
    {name:'Catalogue', index:'catalogue.Catalogue', width:100, align:"left",
        editable:true, edittype:'select',
        editoptions: {dataUrl:'xtras/selectOptions.php?optionFunction=CatalogueSelect'}
    },

带内联编辑的构建网格 html 代码显示:

<select class="editable" id="23368_Catalogue" name="Catalogue" size="1">
    <option value="0">Select</option>
    <option value="2064">KSCOPE370</option>
    <option value="2063">KSCOPE369</option>
...
</select>

我希望网格传递给 select 的服务器值,例如 [Catalogue] => 2064,但网格发送给服务器:

[Catalogue] => KSCOPE370

如果我添加到列定义 formatter:'select', - 它发送 2064 的正确值,但是如果我尝试内联编辑,则取消它 - [=21= 的可见值] 字段消失: 是:

Catalogue    ISRC   ...
KSCOPE370   GBCQV0200197   .....

取消编辑后变为:

Catalogue    ISRC   ...
            GBCQV0200197   .....

正确的处理方法是什么?

重要的是要了解网格中数据的格式必须与编辑的格式相对应。用于列 Catalogue 的输入数据是 "KSCOPE370""KSCOPE369" 之类的字符串,而不是 ID 20642063。这意味着 jqGrid 保持 "KSCOPE370",但这意味着新修改的数据必须采用保存格式:字符串而不是 ids。

如果您当前的代码试图在编辑后尝试在网格中保存值 2064,那么它将会失败。它在本地保存 KSCOPE370 并将 Catalogue=KSCOPE370 发送到服务器,因为您没有将 formatter: "select" 指定到列 Catalogue。如果调试代码,可以看到新值将正确保存在网格中,但服务器端会出现问题。您的服务器代码似乎需要 ID 而不是文本,因此无法处理数据 Catalogue=KSCOPE370。您使用内联编辑 aftersavefunc 中的 .trigger("reloadGrid", [{current: true}]) 重新加载网格。重新加载网格后将显示空文本。

jqGrid 提供了两个主要选项:文本的使用和id 的使用。通常一个数据库 table 保存查找数据。我个人总是通过在文本上使用 IDENTITY(或 AUTO_INCREMENT) column for id and the column with the text. Additionally I create always UNIQUE CONSTRAINT)来创建查找 tables。它可以确保人们不仅可以通过 id 获取文本,还可以通过文本获取 id如果需要的话。因此,在填充和编辑网格期间可以轻松使用文本。id 值可以在需要时在服务器端按名称解析。

如果确实需要使用 id 而不是文本,那么您应该

  1. Catalogue 中的 ID 代替文本填充网格。
  2. 应该使用 formatter: "select" 来显示文本而不是网格中的 ID。
  3. 不能使用 editoptions.dataUrl 提供 id 和文本之间的映射,因为 dataUrl 请求将使用异步 Ajax 请求进行处理,但需要有映射已经用于填充网格。 formatter: "select" 必须具有值。因此必须使用 editoptions.value 而不是 editoptions.dataUrlthe answer or this one中描述了问题的解决方案。它建议 return 将 editoptions.value 值与网格的主要数据一起使用,并在 formatter: "select" 使用该值之前使用 beforeProcessing 设置 editoptions.value .这种方法还减少了 HTTP 流量,因为不需要每次编辑行时都向 dataUrl 发出请求。

更新: 我将 the changes 发布到 GitHub 以将 <option> 中的 value 发送到服务器,即使没有 formatter: "select" 被定义。它仍将使用 text 进行 local 编辑。此类更改应提高免费 jqGrid 与旧版本 jqGrid 的兼容性。