easyUI 渲染 combobox 加载数据源 && 添加自定义数据

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/nnn_net/article/details/52765007

最近接触easyUI比较多,小知识点才做出来又遇到一样的问题,脑子不好使,就记下来吧。


大概说明一下数据结构,AgentId对应Value,WebsiteName对应Text,至于从后台获取数据原始的ajax都可以。首先定义一个空的集合,然后将自己要添加的那一列数据赋值进去。

var array = {};
        array.AgentId = 999;
        array.WebSiteName = "请选择代理商";
        var newCombo;
        function getAllAgentInfo() {
            var strUrl = "GetAgentList";
            $.when(Lsxx.Ajax.Syn(Lsxx.Ajax.Method.Get, strUrl, null, 8000))
                .done(function (result) {
                    if (result != null && result.length > 0) {
                        result.unshift(array);
                        newCombo = result;
                    }
                });
        }

        getAllAgentInfo();
这边用Get方法请求到后台传过来的数据,获取到数据以后可以看到array是有内容的,这里用到unshift方法将array添加到结果集的前面。


返回出来新的集合如图:


下一步就是渲染combobox:

$('#seleAgentId').combobox({
            data: newCombo,
            valueField: 'AgentId',
            textField: 'WebSiteName',
            panelHeight: 'auto',
            editable: false,
            required: true,
            onLoadSuccess: function () { //加载完成后,设置选中第一项
                $(this).combobox("select", 999);
            }
        });

对应的绑定value和text,并在加载事件中默认选中第一条,这里需要注意的是渲染一定要写在请求数据之后,不然起不到效果的。

效果图如下:


END

没有更多推荐了,返回首页