EasyUI(v1.26) Combox 几种使用方发与BUG

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也出现同样问题。

 


EasyUI(v1.26) Combox 几种使用方发与BUG

你可能感兴趣的:(easyui)