easyui-combobox用法

以省份下拉框为例，两种写法，第一种设置默认值有问题，推荐第二种。

1）第一种方法
HTML代码：

<th>省份</th>
<td>
<select class="easyui-combobox" id="provinceList" name="provinceList" style="width:200px;" >
</select>
</td>js代码：
//后台查询省份数据，以键值对列表的json形式返回
//查询条件，多选
//打开页面时在$(function(){}方法中调用findProvinceList()方法初始化省份列表
function findProvinceList()
{
$('#provinceList').empty();
$('#provinceList').combobox({
type: "POST",
url: "${ctx}/jsp/province/findprovinceList.action",
valueField:'provinceId',
textField:'provinceNm',
multiple:true, //设置为多选框
onLoadSuccess: function () {
var val = $(this).combobox("getData");//获取加载的数据
//循环列表第一行的键值对
for (var item in val[0]){
if (item == "provinceId"){
//设置默认值为列表第一个
$(this).combobox("select", val[0][item]);
}
}
}
});
}java代码：
/**
* 初始化省份下拉列表
*/
@RequestMapping("/findProvinceList")
public void findProvinceList(Map<String, Object> paraMap){
//查询后台数据
List<Object[]> rdataList=provinceService.findProvinceList(paraMap);
JSONObject json = new JSONObject();
JSONArray array = new JSONArray();
//默认值
json.put("cityId", "");
json.put("cityNm", "全国");
array.add(json);
for (Object[] objects:rdataList)
{
json.put("provinceId", objects[0]);
json.put("provinceNm", objects[1]);
array.add(json);
}
try
{
//System.out.println(array);
//System.out.println(JSON.toJSONString(array));
//返回json数据到前台
response.getWriter().write(array.toString());
}
catch (IOException e)
{
e.printStackTrace();
}
}2）第二种方法

html代码：
<th width="5%">省份</th>
<td width="15%" align="left">
<select class="easyui-combobox" id=cityIdSelect name="cityIdSelect" data-options="multiple:true,multiline:true" style="width:200px;">
<c:forEach items="${cityList}" var="citys" varStatus="status">
<option value="${citys.cityId}">${citys.cityNm}</option>
</c:forEach>
</select>
</td>js代码：

//直接获取选择的省份id作为查询条件查询业务数据

var provinceIds = $("#provinceList").combobox('getValues')+"";

java代码：

/**
* 打开查询功能页面，在页面打开之前先查询后台省份数据通过ModelMap直接带到前台
* @return
*/
@RequestMapping("/initQueryList")

public String initQueryList(ModelMap modelMap)
{
//打开页面之前查询省份，初始化省份列表
Map<String, Object> paraMap = new HashMap<String, Object>();

4000
List<Object[]> rdataList=provinceService.findProvinceList(paraMap);
//存储省份键值对列表的容器
List<Map<String, Object>> provinceList = new ArrayList<Map<String, Object>>();
//存储省份键值对的临时容器
Map<String, Object> map = new HashMap<String, Object>();
map.put("cityId", "");
map.put("cityNm", "全省");
cityList.add(map);
for (Object[] objects:rdataList)
{
map = new HashMap<String, Object>();
map.put("cityId", objects[0]);
map.put("cityNm", objects[1]);
cityList.add(map);
}
//放入ModelMap中，前台获取
modelMap.put("provinceList", provinceList);
return "/page/queryData/province_List";
}