单击 jqGrid 中的行时填充下拉列表的错误答案

【问题标题】：Bug in populating dropdown on clicking the row in a jqGrid单击 jqGrid 中的行时填充下拉列表的错误
【发布时间】：2011-02-24 10:47:59
【问题描述】：

我想在单击行时填充 jqGrid 单元格下拉列表。我正在单击该行，但下拉列表未填充。

我为在编辑或单击行时填充下拉列表而编写的代码是：

colModel: [
            { name: 'Emp_code', width: 50, sortable: false, align: "center" },
            { name: 'Emp_name', width: 200, sortable: false },
        //{ name: 'totalhours', width: 100, sortable: false, align: 'center', editable: true, edittype: "select", editoptions: { value: "1:1;2:2;3:3;4:4;5:5;6:6;7:7;8:8;9:9"} }
            {name: 'totalhours', index: 'totalhours', width: 100, sortable: false, align: 'center', editable: true, edittype: "select",
            editoptions:
            {
                dataInit: function(elem) {

                    $(elem).empty()
                    .append($('<option></option>').val("1").html("Apples"))
                    .append($('<option></option>').val("2").html("Oranges"));

                }
            }
        }
        ],

我想在行点击时填充总小时数列，该列将填充苹果和橙子，但不知何故我得到了空白下拉列表。在行上单击下拉菜单会显示，但未填充。

【问题讨论】：

为什么不使用editoptions: value（见trirand.com/jqgridwiki/doku.php?id=wiki:common_rules#select）？当您写下“单击行”时需要下拉菜单时，您的意思是什么？您是否使用单元格编辑模式或在选择行上实施内联编辑？通常在dataInit 内部，您应该不覆盖单元格包含的包含。如果你需要自定义编辑控件，你应该使用这个：trirand.com/jqgridwiki/doku.php?id=wiki:common_rules#custom
好吧，我是这个论坛的新手……所以还不习惯按钮和界面……当然，如果我得到答案，我会接受它……如果有的话我没有这样做......我很抱歉这不是故意的......问题是......它只是我实际上将实现从网络服务重新调整的json的虚拟数据......但不幸的是，这不仅仅是......所以我将如何从 web 服务本身放置 json（这是实际的想法）
主要思想是原始内容将保持原样......但是当我单击该行时......它将进入编辑模式......并且下拉列表将具有json（或特别不是静态的项目列表..它必须是动态的）加载到下拉列表中。 ..上面的代码只是为了测试......如果下拉列表被填充了......当我点击jqGrid行时

标签： jqgrid jqgrid-asp.net

【解决方案1】：

如果您需要从服务器获取选项选项，您应该使用editoptions dataUrl 和可选的buildSelect。如果服务器返回 JSON 而不是 HTML 片段，如

<select><option value="1">Apples</option><option value="2">Oranges</option></select>

可以使用buildSelect 将服务器响应转换为格式。如果服务器返回 JSON 格式的字符串，您的 buildSelect 事件处理程序实现可以将 JSON 字符串转换为对象，然后从对象构造字符串 <select>...</select>。

您可以找到相应的代码示例，例如here。

【讨论】：

我已经发布了我的代码片段。你建议的。但仍然没有结果..不确定是什么原因造成的

【解决方案2】：

根据你的建议我这样做了..

 colModel: [
            { name: 'Emp_code', width: 50, sortable: false, align: "center" },
            { name: 'Emp_name', width: 200, sortable: false },
        //{ name: 'totalhours', width: 100, sortable: false, align: 'center', editable: true, edittype: "select", editoptions: { value: "1:1;2:2;3:3;4:4;5:5;6:6;7:7;8:8;9:9"} }

           {name: 'totalhours', width: 100, sortable: false, align: 'center', editable: true, edittype: "select",
           editoptions: { dataUrl: '../Services/ServiceTest.asmx/GetListHours',
               buildSelect: function(data) {
                   alert('hello i am here ');
                   var response = jQuery.parseJSON(data.responseText);
                   var s = '<select>';
                   if (response && response.length) {
                       for (var i = 0, l = response.length; i < l; i++) {
                           var ri = response[i];
                           s += '<option value="' + ri + '">' + ri + '</option>';
                       }
                   }
                   return s + "</select>";
               }

           }
       }
        ],

而我要求的相应网络服务是：

public String GetListHours() 
    {
        List<int> list = new List<int> { };            
        for (int i = 0; i < 10; i++)
        {
            list.Add(i);
        }
        return JsonConvert.SerializeObject(list);
    }

但是当我单击该行时，下拉列表仍显示为空白...是否有任何事件需要我通过？当我单击一行时应该触发？填充下拉列表？以上是我根据您的建议尝试实现的代码。但似乎它甚至没有调用 dataurl 来填充，因为函数警报根本没有触发

【讨论】：

尝试查看关于 Fiddler（参见 fiddler2.com/fiddler2）或 Firebug（参见 getfirebug.com）的服务器响应。我想您当前的 Web 服务实现在 SOAP XML 中发送 JSON 字符串。您应该使用 ASMX、WCF 并将相应的属性与ResponseFormat = ResponseFormat.Json 一起放置。有关更多信息，请参阅stackoverflow.com/questions/3196569/…。