下拉列表框
继承$.bo.defaults. 重写$.bobox.defaults.
组合框显示一个可编辑的文本框和下拉列表,用户选择一个或多个值。用户可以直接输入文本到顶部的列表,或选择一个或多个当前值列表。
width="300" height="150" src="/resources/jquery-easyui-1.3.2/demo/combobox/basic.html" frameborder="no" scrolling="no" style="width: 100%; height: 350px;">
依赖
combo应用实例
从<select>创建下拉列表框元素与一个预定义的结构。
[html]预览复制print? <selectid="cc"class="<atitle="EasyUI"href="/tag/easyui/">EasyUI</a>-combobox"name="dept"style="width:200px;"><optionvalue="aa">aitem1</option><option>bitem2</option><option>bitem3</option><option>ditem4</option><option>eitem5</option></select>
<select id="cc" class="EasyUI-combobox" name="dept" style="width:200px;"><option value="aa">aitem1</option><option>bitem2</option><option>bitem3</option><option>ditem4</option><option>eitem5</option></select>
创建下拉列表框从<input>标记。
[html]预览复制print? <inputid="cc"class="easyui-combobox"name="dept"data-options="valueField:'id',textField:'text',url:'get_data.php'"/>
<input id="cc" class="easyui-combobox" name="dept" data-options="valueField:'id',textField:'text',url:'get_data.php'" />
使用javascript创建下拉列表框。
[html]预览复制print? <inputid="cc"name="dept"value="aa">$('#cc').combobox({url:'combobox_data.json',valueField:'id',textField:'text'});
<input id="cc" name="dept" value="aa">$('#cc').combobox({url:'combobox_data.json',valueField:'id',textField:'text'});
创建两个依赖的组合框。
[html]预览复制print? <inputid="cc1"class="easyui-combobox"data-options="valueField:'id',textField:'text',url:'get_data1.php',onSelect:function(rec){varurl='get_data2.php?id='+rec.id;$('#cc2').combobox('reload',url);}"/><inputid="cc2"class="easyui-combobox"data-options="valueField:'id',textField:'text'"/>
<input id="cc1" class="easyui-combobox" data-options=" valueField: 'id', textField: 'text', url: 'get_data1.php',onSelect: function(rec){var url = 'get_data2.php?id='+rec.id;$('#cc2').combobox('reload', url);}" /><input id="cc2" class="easyui-combobox" data-options="valueField:'id',textField:'text'" />
json数据格式示例:
[{"id":1,"text":"text1" },{"id":2,"text":"text2" },{"id":3,"text":"text3","selected":true},{"id":4,"text":"text4" },{"id":5,"text":"text5" }]
属性
属性从Combo扩展,下面是添加属性组合框。
事件
事件从Combo扩展,下面是添加事件为下拉列表框。
方法
从Combo的方法扩展,下面是添加或重写的方法为下拉列表框。
