SpringMVC+Hibernate+jQuery AutoComplete

1: 展示页面信息

 

在对应页面引入 autoComplete的js文件 ,

	<link rel="stylesheet" href="jQuery UI/jquery-ui-1.8.19.custom.css" type="text/css"/>
	<script src="jQuery UI/jquery-1.7.2.min.js" type="text/javascript"></script>
	<script src="jQuery UI/jquery-ui-1.8.19.custom.min.js" type="text/javascript"></script>

 输入框信息,

<input type="text" id="id" name="user.id" value ="" onkeyup="keyUp()" title="请输入用户编号"/>

 

KeyUp方法:

    	/**
    	 * autoComplete 用户编号查询
    	 */
    	 function keyUp(){
    		var id = document.getElementById("id").value;
    		var url = "${pageContext.request.contextPath}/testAutoComplete.htm?stuStr="+id;
			$( "#id" ).autocomplete({
				source:url,
				minLength:3
			});
    	 }

 

 

 

2:页面效果:(附件)

 

 

 

 

 

3:SpingMVC 控制器代码

 

package zhang.controller;

import java.util.ArrayList;
import java.util.List;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.springframework.web.servlet.ModelAndView;
import org.springframework.web.servlet.mvc.Controller;
import zhang.service.Test5Service;

public class AutoCompleteController implements Controller {

	private Test5Service test5Service;
	
	private String stuStr;
	
	
	public ModelAndView handleRequest(HttpServletRequest request,
			HttpServletResponse response) throws Exception {
		stuStr = request.getParameter("stuStr");
		if( !"".equals(stuStr)&&null!=stuStr ){
			List<String> list = test5Service.selStuId(stuStr);
			List<String> list1 = new ArrayList<String>();
			 for( String s:list ){
				 String s1 = "\""+s+"\"";
				 list1.add(s1);
			 }
			response.getWriter().print(list1);
		}else{
			System.out.println("数据为空.");
		}

		return null;
	}
	public Test5Service getTest5Service() {
		return test5Service;
	}
	public void setTest5Service(Test5Service test5Service) {
		this.test5Service = test5Service;
	}
	public String getStuStr() {
		return stuStr;
	}
	public void setStuStr(String stuStr) {
		this.stuStr = stuStr;
	}

}






4:Service 实现层代码
@SuppressWarnings("unchecked")
public List<String> selStuId( String stuStr ){
stuStr = "select id from User user where user.id like '"+stuStr+"%'";
Session sess = this.getHibernateTemplate().getSessionFactory().openSession();
List<String> stuIdLists = sess.createQuery(stuStr).list();
sess.close();
return stuIdLists;
}

 

 

5:配置信息

 	<bean name="/testAutoComplete.htm" class="zhang.controller.AutoCompleteController">
		<property name="test5Service" ref="test5Service" />
	</bean>	

	<bean id="test5Service"  class="zhang.service.impl.Test5ServiceImpl" >
		<property name="sessionFactory" ref="sessionFactory" />
	</bean>

你可能感兴趣的:(autocomplete,百度输入框,谷歌输入框)