关于向easyui插件combobox，增添下拉选项

关于向easyui插件combobox，添加下拉选项
    今天在开发过程中，遇到了一个如何关于向easyui插件combobox，添加下拉选项的问题。搞了很久，终于曲线找到了一条解决办法，把解决问题的过程记录如下，供有需要的人参考。
    源代码如下，通过ajax调用，从服务端返回json字符串，并显示在客户端。

$('#test').combobox({    url:'地址',valueField:'version',textField:'name',filter: function(q, row){var opts = $(this).combobox('options'); return row[opts.textField].toLowerCase().indexOf(q.toLowerCase()) >= 0; // 同一转换成小写做比较，==0匹配首位，>=0匹配所有 }});

    现在需要对，返回的结果，增加一个值对选项。
    最先想到的办法当然是通过操作combobox对象属性进行添加。但通过查看官方API，没有提供相应的方法。
    好在有google和baidu，结果搜了一把，没有任何可用方案。网上有方案如下：

$('#test').append('<option value="">增加内容</option>');

证实这个方案起不到任何作用。
    最后想用最直接的方法，后台在返回数据的时候，添加上我需要的键值对，这样前台显示的内容有了，但总感觉这个方法有点挫，还是不甘心就这么作罢了。
    再次查看官方API，发现有个data属性，自动将data属性对应的json对象，解析为combobox下拉列表。突然想到，通过设置、修改data属性值来完成combobox下拉列表的添加。改造代码如下：

$.ajax({ url: '远程地址',dataType: 'json', success: function(jsonstr){                // 修改ajax返回的值jsonstr.push({'name':'新增值','version':'新增键'});        $('#test').combobox({            data:jsonstr,        valueField:'version',        textField:'name',        filter: function(q, row){    var opts = $(this).combobox('options');     return row[opts.textField].toLowerCase().indexOf(q.toLowerCase()) >= 0; // 同一转换成小写做比较，==0匹配首位，>=0匹配所有         }        });    }});

        这样，就解决了通过服务端返回的数据，使用combobox，在前端进行动态添加修改键值对。绕了一圈，总算解决问题。
    PS：如果大家有其他什么好的方法，欢迎提供。

查看更多 下一篇