不处于编辑模式时，如何在 JQGrid 中显示“选择”元素？答案

【问题标题】：How to display a "Select" element in JQGrid, when not in Edit mode?不处于编辑模式时，如何在 JQGrid 中显示“选择”元素？
【发布时间】：2013-12-07 05:27:09
【问题描述】：

我知道editype="select" 选项，但是，为了看到选择，用户必须启动编辑。

相反，我只希望下拉列表默认显示在单元格中，而无需用户开始编辑。

我尝试过的： html是jQGrid AJAX调用的PHP函数返回的：

<cell><select><option>Test</option></select></cell>

我将列的格式化程序设置为“选择”

我该如何做到这一点？

【问题讨论】：

请添加您已经尝试过的代码
我只是在网格中打印了一个选择元素
@V0R73X 如果网格没有显示select 框，它会显示什么？
不清楚您在“HTML 是从 JQGrid ajax 调用的 PHP 函数返回”下的意思。你目前使用editoptions.dataUrl吗？ 仅在编辑期间使用。如果您需要为某些列加载选项列表，则必须扩展主响应，该响应用选项列表填充网格。我的意思是beforeProcess 的用法，例如here 或here
您应该提供更多详细信息。例如cloModel 中的列的定义，您要在其中放置<select>。需要有关用于加载选择的不清楚的 Ajax 调用的更多信息。列的所有单元格中的选择相同的选项列表吗？如果用户更改了一个单元格中的选项，您需要做什么？

标签： jquery jqgrid

【解决方案1】：

是的，您可以在列模型中使用 custom fortmatter 来实现

{
name: 'MyCol', index: 'MyCol', formatter: customSelectboxRenderer
}

然后

function customSelectboxRenderer(cellValue, opts, rowObject){
   return "<select>...</select>";//options can be prepared from some local array
}

【讨论】：

如果 html 已经写入 JQGrid 并且我只是希望它显示为 Select 怎么办？
@V0R73X，您不能简单地将 html 更改为选择框。 jQgrid 提供了渲染单元的完全控制。请使用它而不是显示文本然后转换为 selct :)
但是我的数据已经在初始 ajax 请求期间被提取，使用自定义格式化程序意味着对 Select 框的另一个 ajax 请求，效率不高。
@V0R73X，在初始请求时将这些选项数据保存在本地数组中并使用它
我怀疑这会起作用，这取决于何时调用自定义格式化程序：在 gridComplete 之后或之前

【解决方案2】：

假设你的意思

<cell><select><option>Test</option></select></cell>

是为相关单元格返回的响应。

我认为你只需要去掉单元格标记并从你自己的自定义格式化程序中返回它像

function customFormatter(cellValue, opts, rowObject){
   // Assuming that cellValue is <cell><select><option>Test</option></select></cell>

  return cellValue.replace(blah);
}

或者，如果您可以更改从服务器返回的单元格值，那么我会尝试查看它是否在没有格式化程序的情况下工作，如果它不工作，您会想要创建返回单元格值的自定义格式化程序。

function customFormatter(cellValue, opts, rowObject){
  // Assuming that cellValue is <select><option>Test</option></select>
  return cellValue;
}

如果我的假设不正确，请澄清。

【讨论】：

它不起作用，因为在完成数据填充的 ajax 调用之前调用了格式化程序函数。我对其进行了测试以验证。
对数据中的每一行调用格式化函数。我以前使用过这种技术。我认为正在发生的事情是您没有使用 local/json 作为数据源，而是表已经被标记并且您正在向其中添加 jqgrid，对吗？
单元格值是去掉所有html标签的数据。例如，对于上面的示例，它只是测试。

【解决方案3】：

我做了我一生中做过的最偷偷摸摸的事情：
我在服务器端数据上将“<，并将“>”字符更改为 &gt;。
这样，jqgrid 接收到的数据不会被剥离标签。
然后我制作了一个自定义格式化程序，它用实际字符替换了 html 代码，从而使数据正确显示。

formatter: function(cellvalue, options, rowObject){ return cellvalue.replace("&lt;","<").replace("&gt;",">"); }

轰隆隆！完成交易。

【讨论】：