码迷,mamicode.com
首页 > Web开发 > 详细

.net+easyui--combobox

时间:2016-01-26 17:58:34      阅读:166      评论:0      收藏:0      [点我收藏+]

标签:

一:预定义结构的 select 元素创建组合框(combobox)值固定写死

<select class="easyui-combobox" name="state" style="width: 200px;">
            <option value="AL">Alabama</option>
            <option value="AK">Alaska</option>
            <option value="AZ">Arizona</option>
            <option value="AR">Arkansas</option>
            <option value="CA">California</option>
            <option value="CO">Colorado</option>
       </select>

效果图:

技术分享

  二:使用 javascript 创建组合框(combobox) 动态加载

<input id="cc" name="dept" value="aa">

JS代码:

$(‘#cc‘).combobox({
                url: ‘test_list.aspx?id=1‘,
                valueField: ‘id‘,
                textField: ‘text‘
            });

C#后台代码:

protected void Page_Load(object sender, EventArgs e)
        {
            if (Request["id"] == "1")
            {
                string josn =
           "[{                  " +
           "    \"id\":1,       " +
           "    \"text\":\"text1\"  " +
           "},{                 " +
           "    \"id\":2,         " +
           "    \"text\":\"text2\"  " +
           "},{                 " +
           "    \"id\":3,         " +
           "    \"text\":\"text3\", " +
           "    \"selected\":true " +
           "},{                 " +
           "    \"id\":4,         " +
           "    \"text\":\"text4\"  " +
           "},{                 " +
           "    \"id\":5,         " +
           "    \"text\":\"text5\"  " +
           "}]                  ";

                Response.Clear();
                Response.Write(josn);
                Response.End();
            }

        }

效果图:

技术分享

三:创建两个依赖的组合框(combobox) 联动效果:

<input id="cc1" class="easyui-combobox" data-options="
    valueField: ‘id‘,
    textField: ‘text‘,
    url: ‘test_list.aspx?id=1‘,
    onSelect: function(rec){
    var url = ‘test_list.aspx?id=‘+rec.id;
    $(‘#cc2‘).combobox(‘reload‘, url);
    }">
        <input id="cc2" class="easyui-combobox" data-options="valueField:‘id‘,textField:‘text‘"></div>

 JS获取combobox值

 //取ID
$(‘#cc‘).combobox(‘getValue‘);
//取显示的name
$(‘#cc‘).combobox(‘getText‘);

 

.net+easyui--combobox

标签:

原文地址:http://www.cnblogs.com/huqian1210/p/5161092.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!