jeecg3.5版本中comboBox标签的使用及完善
jeecg的官方文档是这样介绍comboBox标签的使用的：
| 属性名 | 类型 | 描述 | 是否必须 | 默认值 |
| name | string | 控件名称 | 是 | null |
| url | string | 远程数据访问 | 是 | null |
| id | string | 唯一标识 | 是 | null |
| text | string | 显示文本 | 是 | null |
| width | string | 宽度 | 否 | null |
| listWidth | string | 下拉框宽度 | 否 | null |
| listHeight | string | 下拉框高度 | 否 | null |
用法：
<t:comboBox url="jeecgDemoController.do?combox" name="sex" text="userName" id="id"></t:comboBox>
但没有介绍远程数据返回时要以什么格式返回，找到jeecgDemoController.do?combox对应的代码发现是这样的：
@RequestMapping(params = "combox")
@ResponseBody
public List<JeecgDemo> combox(HttpServletRequest request, DataGrid dataGrid) {
CriteriaQuery cq = new CriteriaQuery(JeecgDemo.class);
List<JeecgDemo> ls = this.jeecgDemoService.getListByCriteriaQuery(cq, false);
return ls;
}
直接返回实体对象的列表的json封装，但我试过后发现这是错的！观察源码发现这个标签实际上是对jquery easyui的combox的一个封装，如下：
StringBuffer sb = new StringBuffer();
ComboBox comboBox=new ComboBox();
comboBox.setText(text);
comboBox.setId(id);
sb.append("<script type=\"text/javascript\">"
+"$(function() {"
+"$(\'#"+name+"\').combobox({"
+"url:\'"+url+"&id="+id+"&text="+text+"\',"
+"editable:\'false\',"
+"valueField:\'id\',"
+"textField:\'text\',"
+"width:\'"+width+"\',"
+"listWidth:\'"+listWidth+"\',"
+"listHeight:\'"+listWidth+"\',"
+"onChange:function(){"
+"var val = $(\'#"+name+"\').combobox(\'getValues\');"
+"$(\'#"+name+"hidden\').val(val);"
+"}"
+"});"
+"});"
+"</script>");
sb.append("<input type=\"hidden\" name=\""+name+"\" id=\""+name+"hidden\" > "
+"<input class=\"easyui-combobox\" "
+"multiple=\"true\" panelHeight=\"auto\" name=\""+name+"name\" id=\""+name+"\" >");
return sb;
其中定义了下拉框中的value取的是id这个字段的值，text取的是text这个字段的值：
+"valueField:\'id\'," +"textField:\'text\',"
所以返回的数据格式就清楚了，必须是类似于以下格式
{[id:'objId',text:'value'],[
id:'objId',text:'value'
]}
我们可以用hashmap或自己写一个类来封装要返回的数据，然后放到list或数组中返回，我这边直接用了jeecg中的ComboBox这个类：
package org.jeecgframework.core.common.model.json;
/**
* 后台向前台返回JSON，用于easyui的datagrid
*
* @author
*
*/
public class ComboBox {
private String id;
private String text;
private boolean selected;
public String getId() {
return id;
}
public void setId(String id) {
this.id = id;
}
public String getText() {
return text;
}
public void setText(String text) {
this.text = text;
}
public boolean isSelected() {
return selected;
}
public void setSelected(boolean selected) {
this.selected = selected;
}
}
最后在controller中的代码大概如下：
@RequestMapping(params = "combox")
@ResponseBody
public List<ComboBox> combox(HttpServletRequest request, DataGrid dataGrid) {
CriteriaQuery cq = new CriteriaQuery(ChannelEntity.class);
List<ChannelEntity> ls = this.channelService.getListByCriteriaQuery(cq, false);
List<ComboBox> comboxList = new ArrayList<ComboBox>(ls.size());
for (ChannelEntity channel : ls) {
ComboBox comboBox = new ComboBox();
comboBox.setId(channel.getId());
comboBox.setText(channel.getName());
comboxList.add(comboBox);
}
return comboxList;
}
需要先从数据库中取了返回的数据，再封装成ComboBox。
象上面这样就大概可以使用jeecg中的comboBox标签了。
但jeecg3.5中的omboBox标签存在两个问题：
1. 只能多选（居然没提供可以设置单选的属性，呃）
2.不能设置默认选中的值（这在编辑界面是必须的呀^_^)
所以我自己对jeecg的代码稍微做了些修改，以支持上面这两个需求。
1.支持设置单选，多选的属性
在ComboBoxTag这个类中增加一个属性和对应的setter方法，如下：
private boolean multiple = true;
public void setMultiple(boolean multiple) {
this.multiple = multiple;
}
修改ComboBoxTag这个类中的end方法，处理multiple属性，如下：
.append("multiple:").append((Boolean.toString(this.multiple))).append(",")
在标签定义文件（WEB-INF\tld\easyui.tld）中增加multiple属性，如下：
<attribute> <name>multiple</name> <rtexprvalue>true</rtexprvalue> <description>是否多选</description> </attribute>
这样只要在使用comboBox标签时在代码中设置multiple属性为false就可以支持单选了。
2.增加设置默认选中的值的属性
在ComboBoxTag这个类中增加一个属性和对应的setter方法，如下：
private String selectedValue;
public void setSelectedValue(String selectedValue) {
this.selectedValue = selectedValue;
}
修改ComboBoxTag这个类中的end方法，处理selectedValue属性，如下：
if (StringUtil.isNotEmpty(this.selectedValue)) {
sb.append("$(\'#").append(name).append("\').combobox(\'setValue\',\'").append(this.selectedValue).append("\');");
}
在标签定义文件（WEB-INF\tld\easyui.tld）中增加selectedValue属性，如下：
<attribute> <name>selectedValue</name> <rtexprvalue>true</rtexprvalue> <description>默认选中值</description> </attribute>
这样只要在使用comboBox标签时在代码中设置selectedValue的值就就可以支持设置默认值了。
最后附上完整的代码：
jsp
<t:comboBox url="channelController.do?combox" name="channelId" text="name" id="id" multiple="false" selectedValue="${channelUserPage.channelId}"></t:comboBox>
controller
@RequestMapping(params = "combox")
@ResponseBody
public List<ComboBox> combox(HttpServletRequest request, DataGrid dataGrid) {
CriteriaQuery cq = new CriteriaQuery(ChannelEntity.class);
List<ChannelEntity> ls = this.channelService.getListByCriteriaQuery(cq, false);
List<ComboBox> comboxList = new ArrayList<ComboBox>(ls.size());
for (ChannelEntity channel : ls) {
ComboBox comboBox = new ComboBox();
comboBox.setId(channel.getId());
comboBox.setText(channel.getName());
comboxList.add(comboBox);
}
return comboxList;
}
ComboBoxTag类：
package org.jeecgframework.tag.core.easyui;
import java.io.IOException;
import javax.servlet.jsp.JspTagException;
import javax.servlet.jsp.JspWriter;
import javax.servlet.jsp.tagext.TagSupport;
import org.apache.commons.lang.StringUtils;
import org.jeecgframework.core.common.model.json.ComboBox;
import org.jeecgframework.core.util.StringUtil;
/**
*
* 类描述：下拉选择框标签
*
* @author: 张代浩
* @date： 日期：2012-12-7 时间：上午10:17:45
* @version 1.0
*/
public class ComboBoxTag extends TagSupport {
protected String id;// ID
protected String text;// 显示文本
protected String url;// 远程数据
protected String name;// 控件名称
protected Integer width;// 宽度
protected Integer listWidth;// 下拉框宽度
protected Integer listHeight;// 下拉框高度
protected boolean editable;// 定义是否可以直接到文本域中键入文本
// modify by jasonzhang 20150415:增加multiple属性以控制下拉框可以单选还是多选
private boolean multiple = true;
// modify by jasonzhang 20150415:增加selectedValue属性设置下拉框的默认选中值
private String selectedValue;
public int doStartTag() throws JspTagException {
return EVAL_PAGE;
}
public int doEndTag() throws JspTagException {
try {
JspWriter out = this.pageContext.getOut();
out.print(end().toString());
out.flush();
} catch (IOException e) {
e.printStackTrace();
}
return EVAL_PAGE;
}
public StringBuffer end() {
StringBuffer sb = new StringBuffer();
// ComboBox comboBox = new ComboBox();
// comboBox.setText(text);
// comboBox.setId(id);
//如果name带有点号如果"business.id"，则用点位符\\.替换掉.
String jqueryIdName = name;
if (name.indexOf('.') > -1) {
jqueryIdName = StringUtils.replace(jqueryIdName, ".", "\\\\.");
}
sb.append("<script type=\"text/javascript\">")
.append("$(function() {")
.append("$(\'#" + jqueryIdName + "\').combobox({")
.append("url:\'" + url + "&id=" + id + "&text=" + text + "\',")
.append("editable:\'false\',")
.append("multiple:").append((Boolean.toString(this.multiple))).append(",")
.append("valueField:\'id\',")
.append("textField:\'text\',")
.append("width:\'" + width + "\',")
.append("listWidth:\'" + listWidth + "\',")
.append("listHeight:\'" + listWidth + "\',")
.append("onChange:function(){")
.append("var val = $(\'#" + jqueryIdName
+ "\').combobox(\'getValues\');")
.append("$(\'#" + jqueryIdName + "hidden\').val(val);").append("},");
// modify by jasonzhang 20150415:增加selectedValue属性设置下拉框的默认选中值
sb.append("onLoadSuccess:function(data){");
if (StringUtil.isNotEmpty(this.selectedValue)) {
sb.append("$(\'#").append(jqueryIdName).append("\').combobox(\'setValue\',\'").append(this.selectedValue).append("\');");
}
sb.append("}").append("});});");
sb.append("</script>");
sb.append(
"<input type=\"hidden\" name=\"").append(name).append("\" id=\"").append(name).append("hidden\"");
// modify by jasonzhang 20150415:增加selectedValue属性设置下拉框的默认选中值
if (StringUtil.isNotEmpty(this.selectedValue)) {
sb.append(" value=\"").append(this.selectedValue).append("\"");
}
sb.append(" > ");
sb.append("<input class=\"easyui-combobox\" ")
.append(" panelHeight=\"auto\" name=\"" + name + "name\" id=\""
+ name + "\" >");
return sb;
}
public void setId(String id) {
this.id = id;
}
public void setText(String text) {
this.text = text;
}
public void setUrl(String url) {
this.url = url;
}
public void setName(String name) {
this.name = name;
}
public void setMultiple(boolean multiple) {
this.multiple = multiple;
}
public void setSelectedValue(String selectedValue) {
this.selectedValue = selectedValue;
}
}
标签文件中comboBox对应部分
<tag> <name>comboBox</name> <tag-class>org.jeecgframework.tag.core.easyui.ComboBoxTag</tag-class> <body-content>JSP</body-content> <description>下拉选择框</description> <attribute> <name>name</name> <required>true</required> <rtexprvalue>true</rtexprvalue> <description>控件名称</description> </attribute> <attribute> <name>url</name> <required>true</required> <rtexprvalue>true</rtexprvalue> <description>远程数据</description> </attribute> <attribute> <name>id</name> <required>true</required> <rtexprvalue>true</rtexprvalue> <description>ID对应字段</description> </attribute> <attribute> <name>text</name> <required>true</required> <rtexprvalue>true</rtexprvalue> <description>text对应字段</description> </attribute> <attribute> <name>width</name> <rtexprvalue>true</rtexprvalue> <description>width对应字段</description> </attribute> <attribute> <name>listWidth</name> <rtexprvalue>true</rtexprvalue> <description>listWidth对应字段</description> </attribute> <attribute> <name>listHeight</name> <rtexprvalue>true</rtexprvalue> <description>listHeight对应字段</description> </attribute> <attribute> <name>multiple</name> <rtexprvalue>true</rtexprvalue> <description>是否多选</description> </attribute> <attribute> <name>selectedValue</name> <rtexprvalue>true</rtexprvalue> <description>默认选中值</description> </attribute> </tag>
20150420更新：
修改如果下拉框的名字带有点号，下拉框将不能正常工作的bug