Question

请问如何用easyui的combobox实现中文搜索

我想用easy ui 的combobox做中文搜索功能，使用的onchange事件reloader后显示出来的是valuefield。请问如何解决？

Answer 1

之前我和你遇到过一样的问题，不要使用onChange，使用loader，我用的是J2EE，不知道你用的是什么环境，但大体是差不多的，主要是JS和HTML部分，你可以试试：

需求：1、每输入一个字符，读取数据库查询15条近似数据2、读出数据后，按上、下键+回车键进行选择

【JavaScript】
//easyUI combobox中不要使用onChange来做读取数据库操作，有很多BUG，建议使用loader
var btsloader = function(param,success,error){

//获取输入的值
var q = param.q || "";

//此处q的length代表输入多少个字符后开始查询
if(q.length <= 0) return false;
$.ajax({
url:"<%=path%>/jsonObj/costAction_getJSONCostList",
type:"post",
data:{
//传值，还是JSON数据
searchName:q
},

//重要，如果写jsonp会报转换错误，此处不写都可以
dataType:"json",
success:function(data){

//关键步骤，遍历一个MAP对象
var items = $.map(data.rows, function(item){
return {
id:item.id,
name:item.text
};
});

//执行loader的success方法
success(items);
},

//异常处理
error:function(xml, text, msg){
error.apply(this, arguments);
}
});
};

【HTML】
<input id="costId" name="costId" class="easyui-combobox" style="width:250px;" data-options="
loader: btsloader,
mode: 'remote',
valueField: 'id',
textField: 'name'" />

【JAVA】public String getJSONCostList() throws UnsupportedEncodingException, JSONException{
List<HashMap<String, Object>> jsonArr = new ArrayList<HashMap<String, Object>>();
List<Cost> list = costService.searchCosts(0, 14, searchName);
for(Cost c: list){
HashMap<String, Object> hm = new HashMap<String, Object>();
hm.put("id", c.getId());
hm.put("text", c.getBtsName());
jsonArr.add(hm);
}
HashMap<String, Object> hm = new HashMap<String, Object>();
hm.put("rows", jsonArr);
result = JSONObject.fromObject(hm);
return "ajax";
}

【struts.xml】
<package name="jsonObj" namespace="/jsonObj" extends="json-default">
<action name="*_*" class="{1}" method="{2}">
<result name="ajax" type="json">
<param name="root">result</param>
</result>
</action>
</package>

传入的JSON Object举例： {"rows":[{"id":1,"text":"基站1"},{"id":2,"text":"基站2"}]}

追问

多谢，已经实现了。还有一个问题。就是我希望初始化combobox的时候就发起一个默认请求填充默认值。这个如何实现？

追答

试试初始化页面时定义一个JSON对象，或者用AJAX从后台获取一个JSON对象，再用$("#xxx").combobox("loadData", data);来加载这组数据

Answer 2

easyui 的 combobox 本身是具有搜索功能的，听你的描述，似乎是要实现边输入边过滤的下拉菜单功能？那么就可以用下面这样的的写法，从服务器端搜索内容：
<input type="text" name="comboname" class="easyui-combobox" data-options="valueField:'id',textField:'name',editable:true,url:'/server/action'" value="${bean.comboname}" />

这样就可以实现从“/server/action”获取json数据，并边输入边过滤的功能了。
同时，value="${bean.comboname}"这个写法就能实现你想要的默认值功能。