easyUI对combobox设置value和text

参考自：点击打开链接

 

 

 

1.出现的问题

 

当再编辑教师，进行教师信息回显的时候。

 

对于上面这个情况，我期望的时候，传入后台的数据，是专业所在的编号id，而不是“软件工程”这个名字。

但是如果不对教师进行更改院系和专业，那么传入后台的就是名字，而不是id。

 

2.问题分析

下面贴上代码：

easyUI的代码：

 

							
$('#mname').combobox({   
								
     required:true, 
								
     editable:false,
								
     valueField:'mno',    
								
     textField:'mname',

     value:t.mname//t是后台已经查询出当前要回显的教师对象。 
});

 

前台所在的代码

 

<form  id='teacherForm' method="post">
	
			
		<div  style="width:100%;margin-top:3px;">
			<font size="2">请选择所在院系：</font> 
			<!-- 专业所在院系：下拉框，用户选择 -->
			<select id="cname" name="cno" style="width:100%;max-width:150px;"></select>
		</div>
		<div  style="width:100%;margin-top:3px;">
			<font size="2">请选择所在专业：</font> 
			<!-- 专业所在院系：下拉框，用户选择 -->
			<select id="mname" name="mno" style="width:100%;max-width:150px;"></select>
		</div>
	</form>

我为什么把专业所在select的id设成mname，name设成mno，因为，我在easyUI里面设置了valueField代表mno，textField代表mname。

 

因为展示给用户的要是文字mname，而不能是编号mno。

所以，这个select，当用户前台选择 textField（mname）， 而后台提交的是valueField( mno) 个人猜测

 

3.问题出现的原因

所以，问题出现的原因是因为：easyUI的代码中设置了：

   value:t.mname//t是后台已经查询出当前要回显的教师对象。 

 

导致，用户如果不重新进行院系的选择，提交到后台的数据就是 t.mname； 是一串汉字。

 

 

4.解决的办法

只需要将 valueFiled和textField到设置一下就可以了

对valueFiled设置成mno，

对textField设置成mname；

所以，easyUI修改之后的代码如下：

 

$('#mname').combobox({   
								
     required:true, 
								
     editable:false,
								
     valueField:'mno',    
								
     textField:'mname',
							
});  
							
$('#mname').combobox('setValue',t.mno);//一定要先value后text,否则text与value值会相同全为value值  
							
$('#mname').combobox('setText', t.mname); 

注意三个的顺序！

 

这样改好之后，所有的功能就都ok了。