easyui combobox 动态加载数据C#

    <script type="text/javascript" src="Scripts/jquery-1.8.2.min.js"></script>
    <link type="text/css" rel="Stylesheet" href="jquery-easyui-1.6.11/themes/default/easyui.css" />
    <link type="text/css" rel="Stylesheet" href="jquery-easyui-1.6.11/themes/icon.css" />
    <script type="text/javascript" src="jquery-easyui-1.6.11/jquery.min.js"></script>
    <script type="text/javascript" src="jquery-easyui-1.6.11/jquery.easyui.min.js"></script>
    <script type="text/javascript">
        $(function () {

            $.ajax({
                type: "Post",
                url: "easyuiComboBox.aspx/GetBrowser",
//                data: "{}",
                contentType: "application/json;charset=utf-8",
                dataType: "json",
                success: function (data) {
           
                    $('#first_catalogue').combobox({
                        data: eval(data.d), //eval(data.d)将JSON的字符串解析成JSON数据格式
                        valueField: 'value',
                        textField: 'text',
                        groupField: 'group',
                        required: true,
                        editable: false,
                        onLoadSuccess: function () {
                            //加载完成后,设置选中第一项 
                            var val = $(this).combobox("getData");
                            //设置第一个值为选中值 
                            $(this).combobox("select", val[0].text);
                        },
                        onChange: function () { //getValue，getText分别获取value值，text 
                            var val = $('#first_catalogue').combobox("getText"); alert(val);
                        }
                    });

                },
                error: function (err) {
                    alert(JSON.parse(err.responseText).Message);
                }
            });
           
        });
    </script>

html

 <input class="easyui-combobox" id="first_catalogue" style="width: 30%;" value="--请选择所属分类--">

 

后台代码

        [WebMethod]
        public static string GetBrowser()
        {
            string json = "[{\"value\":\"f20\",\"text\":\"Firefox 2.0 or higher\",\"group\":\"Firefox\"}" +
                ",{\"value\":\"f15\",\"text\":\"Firefox 1.5.x\",\"group\":\"Firefox\"}," +
                "{\"value\":\"f10\",\"text\":\"Firefox 1.0.x\",\"group\":\"Firefox\"}," +
                "{\"value\":\"ie7\",\"text\":\"Microsoft Internet Explorer 7.0 or higher\",\"group\":\"Microsoft Internet Explorer\"}" +
                ",{\"value\":\"ie6\",\"text\":\"Microsoft Internet Explorer 6.x\",\"group\":\"Microsoft Internet Explorer\"}]";
            return json;

            //List<Browser> browsers=new List<Browser>();
            //Browser b= new Browser();
            //b.value ="f20";
            //b.text ="Firefox 2.0 or higher";
            //b.group="Firefox";
            //browsers.Add(b);
            //JavaScriptSerializer jsSerializer = new JavaScriptSerializer();
            //return jsSerializer.Serialize(browsers);
}

显示效果

 

转载于:https://www.cnblogs.com/lidaying5/p/10233013.html