dhtmlxCombo初始化加载，jquery请求加载数据
夏立果
使用jquery的ajax请求到后台，取得数据库数据，返回前台combo中。
引入使用jquery需使用的js文件
<script type="text/javascript" src="js/jquery-1.6.1.js"></script>
<script>window.dhx_globalImgPath = "dhtmlxCombo/codebase/imgs/";
</script>
<link rel="STYLESHEET" type="text/css" href="dhtmlxCombo/codebase/dhtmlxcombo.css"/>
<script src="dhtmlxCombo/codebase/dhtmlxcommon.js"></script>
<script type="text/javascript" src="dhtmlxCombo/codebase/dhtmlxcombo.js"></script>
<script>
var combo_x // 定义combo_x
var combo_y // 定义combo_y
$(document).ready(function(){
// combo初始化
combo_x = new dhtmlXCombo("combo_zone2", "alfa1", 200);
combo_x.addOption([[1, 1111, "color:red"], [2, 2222], [3, 3333], [4, 4444], [5, 5555]]);
combo_y = new dhtmlXCombo("combo_zone3", "alfa2", 200);
combo_y.enableFilteringMode(true); // 自动补全
mycombo(); // jquery的ajax请求到后台，查询数据库数据添加到combo
});
function mycombo(){
$.ajax({
type:"post",
url: "a/combo1.htm",
cache: false,
error:function(){
// alert("没有该病人记录！");
},
success: function(data){
if(data=="fail"){
alert("错误");
}else{
var json = eval("{" + data + "}"); //转化为json数组
for(var i=0;i<json.length;i++){
combo_y.addOption(i,json[i].contents);
}
}
}
});
}
</script>在jsp的html中加入
<body>
<select style='width:200px;' id="combo_zone1" name="alfa1">
<option value="1">a00</option>
<option value="2">a01</option>
<option value="3" selected>a02</option>
</select>
<div id="combo_zone2" style="width:200px; height:30px;"></div>
<div id="combo_zone3" style="width:200px; height:30px;"></div>
</body>combo_y后台，action里代码
@RequestMapping(value="/combo1",method = RequestMethod.POST)
public void hello(HttpServletRequest request,HttpServletResponse response)throws Exception{
response.setContentType("text/html;charset=utf-8");
DBOperator db = new DBOperator();
PrintWriter pw = null;
try
{
pw = response.getWriter();
System.out.println("请求成功");
String sql = "select a.contents from bas_dicts a where a.nekey='122'";
List list = db.find(sql);
JSONArray json = JSONArray.fromObject(list);
pw.print(json.toString());
db.commit();
}
catch (RuntimeException e)
{
e.printStackTrace();
db.rollback();
pw.print("fail");
}
finally
{
db.freeCon();
}
pw.flush();
pw.close();
}
类似资料：