如何将 return select 选项作为 buildSelect 的对象

Question

根据

http://www.trirand.com/jqgridwiki/doku.php?id=wiki:search_config

值属性可以是对象：

If set as object it should be defined as pair value:name - editoptions:{value:{1:'One',2:'Two'}}

Json API returns JSON 对象

{"total":2,"page":1,"rows":[
     {"Id":"L-10020","Liik":"10020","Artlnimi":"C vesinikud","Grupp":"L"},
     {"Id":"L-10072","Liik":"10072","Artlnimi":"C D-Perm","Grupp":"L"}
     ... ] }

Artlnimi 属性值应用作搜索中的 select 选项。我尝试使用它来使用免费的 jqgrid 4.13.6

创建 select 列表

$grid.jqGrid('setColProp', 'Artliik_artlnimi', {
  searchoptions : {
  dataUrl: 'API/ArtliikL',
  buildSelect: function(response){
    var tulem={ '':'All' }, res=JSON.parse(response);
    $.each(res.rows, function(i, item) {
        tulem[item.Artlnimi]=item.Artlnimi;
        }
      );
    return tulem;
    },
  sopt: ['eq']
  },
  stype:"select"
});

那个错误之后

Uncaught TypeError: Cannot read property 'multiple' of undefined
    at Object.success (jquery.jqgrid.src.js:9680)
    at fire (jquery-1.12.4.js:3232)
    at Object.fireWith [as resolveWith] (jquery-1.12.4.js:3362)
    at done (jquery-1.12.4.js:9840)
    at XMLHttpRequest.callback (jquery-1.12.4.js:10311)

出现在第 9680 行的免费 jqgrid 4.13.6 源代码中，其中包含：

 if ($select[0].multiple && $select.find("option[selected]").length === 0 && $select[0].selectedIndex !== -1) {

如何解决此问题，以便搜索元素显示从 buildSelect 返回的对象中的数据。 Ifbild select returns 包含 select 元素的字符串 html 它有效。

Answer 1

URL dataUrl 应该 return HTML 包含 <select> 和所有选项的片段。回调 buildSelect 允许使用 dataUrl，其中 return 是有关任何其他格式的选项的信息，但是 buildSelect 必须隐藏 dataUrl 的响应到 <select> 和所有选项。您可以在 editoptions.buildSelect 的 the old documentation 中找到 buildSelect 回调的以下说明：

This option is relevant only if the dataUrl parameter is set. When the server response can not build the select element, you can use your own function to build the select. The function should return a string containing the select and options value(s) as described in dataUrl option. Parameter passed to this function is the server response

searchoptions.buildSelect 的文档（参见 here）提供了几乎相同的信息。

换句话说，您尝试以错误的方式使用 buildSelect。 returns buildSelect 的字符串必须包含 <select> 的 HTML 片段，而不是 as 对象。或者，免费的 jqGrid 允许 buildSelect returns DOM 元素 <select> 的所有子选项或 jQuery <select>

的包装器

您可以将您的代码修改为

buildSelect: function (response) {
    var tulem = "<select><option value=''>All</option>";

    $.each(JSON.parse(response).rows, function (i, item) {
        var v = item.Artlnimi;
        // the simplified form of the next statement would be
        //     tulem += "<option value='" + v + "'>" + v + "</option>";
        // but one have to encode/escape the text in more common case.
        tulem += "<option value='" +
            String(v).replace(/\'/g, "&#39;") + "'>" +
            $.jgrid.htmlEncode(v) + "</option>";
    });

    return tulem + "</select>";
}

或喜欢

buildSelect: function (response) {
    var $tulem = $("<select><option value=''>All</option></select>");

    $.each(JSON.parse(response).rows, function (i, item) {
        $("<option></option>", { value: item.Artlnimi })
            .text(item.Artlnimi)
            .appendTo($tulem);
    });

    return $tulem;
}

如何将 return select 选项作为 buildSelect 的对象

How to return select options as object from buildSelect

javascript

jquery

json

jqgrid

free-jqgrid