EasyUI(v1.26) Combox 可以内嵌radio tree等,使用灵活方便。但是也有BUG不方便的地方。
使用方法一,使用json设置和传递Combox值。
?
<td>Gender</td> <td><input name="gender" id="editPerson_gender" class="easyui-combobox" style="width:60px" url="combobox_data_gender.json" valueField="id" textField="gender" required="true" editable="false" > </input> </td>
?
?其中url 可以非常灵活的以json格式从后台取的值,或者读取json文件加载,这里为json文件格式
combobox_data_gender.json代码如下:
?
[{ "id":"male", "gender":"Male" },{ "id":"female", "gender":"Female" },{ "id":"unknow", "gender":"Unknow" }]
?请注意:第一行 “id” 为所设置的值,第二行“gender”为设置显示的文本,这两个json key分别对应html valueField和textField
在使用“编辑”功能时,必须先取得原先的值,并且把再获得修改的值,所以使用“编辑”功能,js必须添加以下代码
?
//从已经加载的datagride中所选择的行(row)中获取key值gender中值 $("#editPerson_gender").combobox('setValue',rows[0].gender);
?设置新的“gender”值(这里后台使用Struts2,所以在person.gender才能为传递给后台struts2)
?
//设置json格式的gender的新值 "person.gender":$("#editPerson_gender").combobox('getValue')
?
?
?使用方法二(在IE运行有BUG如下图):
?
<td><select name="person.gender" class="easyui-combobox" panelHeight="60" style="width:60px" required="true" editable="false"> <option>Male</option> <option>Female</option> </select> </td>
?js处理同上,这样更加简单,在Chrome和Firefox运行很正常,但是在IE上运行会出现多选和重新设值不获取新值的情况,根据文档我添加“multiple=“false””也没有作用,运行作者相关demo也出现同样问题。
?