Ajax 模糊查询的简单实现[通俗易懂]

Ajax 模糊查询的简单实现[通俗易懂]类似于百度的搜索引擎模糊查询功能,不过百度的模糊查询功能更强大,这里简单实现下.要实现模糊查询,首先要做的就是把SQL写好。话不多少,直接贴代码了!JSP页面:<%Stringpath=request.getContextPath();StringbasePath=request.getScheme()+"://"+request.getServerName()+":

大家好,又见面了,我是你们的朋友全栈君。

类似于百度的搜索引擎模糊查询功能,不过百度的模糊查询功能更强大,这里简单实现下.

要实现模糊查询,首先要做的就是把SQL写好。话不多少,直接贴代码了!

JSP页面:

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'search.jsp' starting page</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">  
    <script type="text/javascript" src="prototype.js"></script>
    
    <style type="text/css">
       body{font:11px arial;}
       #suggest{
                position:absolute;
                background-color:#FFFFFF;
                text-align: :left;
                border: 1px solid #000000;
                display: none;
       }
    </style>
	<script type="text/javascript">
	    function searchSuggest(){
	    	var url="Search";
	    	var txtSearch=$F("txtSearch");
	    	var pars='txtSearch='+txtSearch;
	    	var searchAjax=new Ajax.Request(
	    	      url,
	    	      {
	    	    	 method:'get',  //get方式提交
	    	    	 parameters:pars, //提交参数
	    	    	 onComplete:processRequest
	    	      }
	    	);
	    }
	    function processRequest(req){
	    	var sobj=$("suggest");
	    	sobj.innerHTML="";
	    	var str=req.responseText.split("-");
	    	var suggest="";
	    	if(str.length>0&&str[0].length>0){
                for(i=0;i<str.length;i++){
                	suggest+="<div>"+str[i]+"</div>";
                }
                sobj.innerHTML=suggest;
                $("suggest").style.display="block";
	    	}else{
	    		$("suggest").style.display="none";
	    	}
	    }
	</script>
  </head>
  <body>
       <h3>Ajax自动搜索提示</h3>
       <div style="width:500px">
          <form action="" id="formSearch">
             <input type="text" id="txtSearch" name="txtSearch"  οnkeyup="searchSuggest()"autocomplete="off"/>
             <input type="submit" id="cmdSerach" name="cmdSearch" value="搜索"/><br/>
             <div id="suggest" style="width:200px"></div>
          </form>
       </div>
  </body>
</html>

Sevlet类:

package servlet.ajax;

import java.io.IOException;
import java.io.PrintWriter;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

public class Search extends HttpServlet {

	public void doGet(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {

          request.setCharacterEncoding("UTF-8");
          response.setCharacterEncoding("UTF-8");
          String req=request.getParameter("txtSearch");
          PrintWriter out = response.getWriter();
          SearchDao sd=new SearchDao();
          sd.getText(req);
          StringBuffer sb=sd.getText(req);
          out.print(sb.toString());
          out.flush();
	}
}

 

进行连接数据库,模糊查询的JAVA类:

package servlet.ajax;

import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.util.ArrayList;
import java.util.List;

public class SearchDao {
	
	public StringBuffer  getText(String req){
		//首先定义下连接数据的URL、用户名、密码
		String url="jdbc:oracle:thin:@127.0.0.1:1521:orcl";
		String user="scott";
		String password="yulei123";
		String sql="select ename from emp a where a.ename like ?";
		if(req.trim().length()==0){
	      sql=sql+" and 1<>1";
		}
		List strList=new ArrayList();
		 try {
			Class.forName("oracle.jdbc.driver.OracleDriver");
			Connection con=DriverManager.getConnection(url,user,password);
			PreparedStatement pre=con.prepareStatement(sql);
			pre.setString(1,"%"+req.toUpperCase().trim()+"%");
			ResultSet rs=pre.executeQuery();
			while(rs.next()){
				String ename=rs.getString("ename");
				strList.add(ename);
			}
		} catch (ClassNotFoundException e) {
			e.printStackTrace();
		} catch (SQLException e) {
			e.printStackTrace();
		}
		StringBuffer sb=new StringBuffer();
		int size=strList.size();
		for(int i=0;i<size;i++){
			sb.append((String)strList.get(i)+"-");
		}
		return sb;
	}
}

代码写好后,就可以在文本框输入字母后就可以模糊查询出数据了!

Ajax 模糊查询的简单实现[通俗易懂]

 

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/139514.html原文链接:https://javaforall.net

(0)
上一篇 2022年5月29日 下午5:36
下一篇 2022年5月29日 下午5:46


相关推荐

  • socketpair原理_socket方法

    socketpair原理_socket方法今天跟人谈到socketpair的问题,晚上回来写了个程序验证下自己的猜测!   先说说我的理解:socketpair创建了一对无名的套接字描述符(只能在AF_UNIX域中使用),描述符存储于一个二元数组,eg.s[2].这对套接字可以进行双工通信,每一个描述符既可以读也可以写。这个在同一个进程中也可以进行通信,向s[0]中写入,就可以从s[1]中读取(只能从s[1]中读取),也可以在

    2022年10月14日
    6
  • pycharm怎么配置tensorflow环境_pycharm环境搭建

    pycharm怎么配置tensorflow环境_pycharm环境搭建Pycharm安装并搭建Tensorflow开发环境下载并安装pycharm1.下载2.pycharm配置python环境安装tensorflow1.输入清华仓库镜像2.创建tensorflow环境3.启动tensorflow环境4.安装cpu版本的TensorFlow5.测试TensorFlowPycharm中配置TensorFlow环境在操作之前先安装好python环境,我是安装的Anaconda,Anaconda下载安装教程可参考:https://blog.csdn.net/Chen_Meng_

    2022年8月26日
    8
  • 通过SOCKS代理渗透整个内网

    通过SOCKS代理渗透整个内网通过SOCKS代理渗透整个内网1.背景经过前期的渗透工作,我们现在已经成功找到了web站点的漏洞,并且获得了一个普通的webshell,现在准备用菜刀去连接它。注意:本次环境在本地搭建,假设现在一无所知,这样更加真实。2.对web服务器提权2.1获取漏洞信息获取到webshell后使用菜刀连接,查看权限是apache,系统是redhat6.5。上传linux.sh到…

    2022年6月17日
    290
  • 修改firefox地址栏的颜色

    修改firefox地址栏的颜色

    2021年8月16日
    55
  • PROXY SERVER 代理服务器[通俗易懂]

    Proxy是什么呢,是代理。普通的因特网访问是一个典型的客户机与服务器结构:用户利用计算机上的客户端程序,如浏览器发出请求,远端WWW服务器程序响应请求并提供相应的数据。而Proxy处于客户机与服务器之间,对于服务器来说,Proxy是客户机,Proxy提出请求,服务器响应;对于客户机来说,Proxy是服务器,它接受客户机的请求,并将服务器上传来的数据转给客户机。它的作用很象现实生活中的代理服务商…

    2022年4月18日
    45
  • linux chmod 755

    linux chmod 755chmod是Linux下设置文件权限的命令,后面的数字表示不同用户或用户组的权限。一般是三个数字:第一个数字表示文件所有者的权限第二个数字表示与文件所有者同属一个用户组的其他用户的权限第三个数字表示其它用户组的权限。权限分为三种:读(r=4),写(w=2),执行(x=1)。综合起来还有可读可执行(rx=5=4+1)、可读可写(rw=6=4+2)、可读可写可执行(rwx=7=4+2+1)。所以,ch…

    2022年7月16日
    26

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号