jQuery EasyUI 为Combo,Combobox 学习记录

 EASYUI 多选下拉框 combobox回显

</pre><pre name="code" class="html"><tr>
					<th><font color="red">*</font>客户类型：</th>
					<td>
					<input id="affiBaseCusType" name="customerType" type="text" value="${affiBaseInfo.customerType }" class="easyui-combobox" />
					 <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-cancel" plain="true" οnclick="clearSelect()"></a>
					</td>
				</tr>

</pre><pre name="code" class="javascript">//客户类型
$('#affiBaseCusType').combobox({
	width:250,
	method:'GET',
	url:'${ctx}/baseinfo/affiliatesDict/json',
    idField : 'id',
    textField : 'name',
    multiple:true,
    multiline:true,
	panelHeight:'auto',
    required:true,
    onLoadSuccess: function () { //加载完成后,设置选中第一项 
        var val = $(this).combobox("getData"); 
        $(this).combobox("clear");
   		var curValue = new Array();
   		curValue = this.value.split(',');
//    		alert(curValue+"______________");
   		for(var j=0;j<curValue.length;j++){
//    			alert(curValue[j]+" ~~~~~~~~~");
   		 	for(var i = 0;i<val.length;i++ ){ 
// 	        	 alert(val[i].value+"!!!!!!!!");
	            if (val[i].value==curValue[j]) { 
	                $(this).combobox("select",curValue[j]); 
	            } 
	        } 
   		}
        
    } 
});

easyui  下拉树列表

<tr>
					<th><font color="red">*</font>国别地区：</th>
					<td>
<%-- 					<input name="country" type="text" value="${affiBaseInfo.country }" class="easyui-validatebox" data-options="required:true"/> --%>
<%-- 					<input name="country" class="easyui-combotree" value="${affiBaseInfo.country }" data-options="url:'${ctx}/system/countryArea/json',method:'get',idField: 'id',textField: 'name'" /> --%>
						<input id="affiBaseCountry" name="country" type="text" value="${affiBaseInfo.country }" class="easyui-validatebox" style="width:200px;" />
					</td>
				</tr>

//国别地区
$('#affiBaseCountry').combotree({
	width:150,
	method:'GET',
    url: '${ctx}/system/countryArea/json',
    idField : 'id',
    textFiled : 'name',
    animate:true,
    required:true
});

easyui  下拉框属性总结

首先，向服务器请求数据的地址：
url : null, 
// 向服务器请求的模式 
method : "post", 
// 本地数据集 
data : null, 
// 是否允许用户自己输入 
// editable : false, 
// 真正的值的 key 
valueField : 'value', 
// 显示的key 
textField : 'text', 
// 宽度 
width : 'auto', 
// 高度 
height : 22, 
// 下拉面板的宽度 
panelWidth : null, 
// 下拉面版的高度 
panelHeight : 200, 
// 是否支持多选 
multiple : false, 
// 多选时,在框内显示用什么分割 
separator : ',', 
// 是否禁用 
disabled : false, 
// 是否显示下拉箭头 
hasDownArrow : true, 
// 默认值 
value : '', 
// 延迟搜索 

delay : 200
}