<%@ page language="java" contentType="text/html; charset=utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<link href="autocomplete/jquery.autocomplete.css" target="_blank" rel="external nofollow" rel="stylesheet" type="text/css">
<script type="text/javascript" src="jquery/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="autocomplete/jquery.autocomplete.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#empCode").autocomplete("autoCompleteAction.action", {
cellSeparator: "|",
lineSeparator: "\n",
minChars: 1,//最小输入数
maxItemsToShow: 10,//最大显示条数
formatItem: function(row) {
//var obj=eval("("+row+")");//将JSON转换成对象
return "员工代码->" +row[0] + " 姓名->" +row[1]+ " 年龄:" + row[2];//显示格式，自定义
},
onItemSelect: function(li) {
$("#empName").val(li.extra[0]);
$("#age").val(li.extra[1]);
$("#orgName").val(li.extra[2]);
}
});
});
</script>
</head>
<body>
员工代码：<input type="text" name="empCode" id="empCode" size="70"><br>
姓名：<input type="text" name="empName" id="empName" readonly="readonly"><br>
年龄：<input type="text" name="age" id="age" readonly="readonly"><br>
部门：<input type="text" name="orgName" id="orgName" readonly="readonly"><br>
</body>
</html>
public class AutoCompleteAction extends ActionSupport {
private String q;//用于接收前台数据 ，必须是q不能时其他名称
private User user;
private List<User> userList;
private AutoCompleteService autoCompleteService;
/**
* @return the userList
*/
public List<User> getUserList() {
return userList;
}
/**
* @param userList the userList to set
*/
public void setUserList(List<User> userList) {
this.userList = userList;
}
/**
* @return the user
*/
public User getUser() {
return user;
}
/**
* @param user the user to set
*/
public void setUser(User user) {
this.user = user;
}
/**
* @param autoCompleteService the autoCompleteService to set
*/
public void setAutoCompleteService(AutoCompleteService autoCompleteService) {
this.autoCompleteService = autoCompleteService;
}
/**
* @return the q
*/
public String getQ() {
return q;
}
/**
* @param q the q to set
*/
public void setQ(String q) {
this.q = q;
}
@SuppressWarnings("unchecked")
public String complete() throws IOException {
userList = autoCompleteService.selectAll(q);
System.out.println(userList.size());
HttpServletResponse response=ServletActionContext.getResponse();
response.setContentType("text/html;charset=utf-8");
for (User user : userList) {
response.getWriter().println(user.getId() + "|" + user.getUserName()+ "|" +user.getAge() + "|" + user.getAddr());
}
return null;
}
}
public class AutoCompleteDaoImpl extends HibernateDaoSupport implements AutoCompleteDao {
/**
* @param q
* @return
* @see com.acca.dao.AutoCompleteDao#selectAll(java.lang.String)
*/
@SuppressWarnings("unchecked")
@Override
public List<User> selectAll(final String q) {
return (List<User>) getHibernateTemplate().execute(new HibernateCallback() {
@Override
public Object doInHibernate(Session session) throws HibernateException, SQLException {
return session.createQuery("from User u where u.addr like ?")
.setParameter(0, ('%'+q+'%'))//注意模糊查询时注意% ，参数从0开始
.list();
}
});
}
}
![用jQuery实现一个简易的聊天框[图]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)