Dwr and jquery implement bone keyword search

Source: Internet
Author: User



Create Web projects, add Struts2 support, and import MySQL drivers, dwr files, and import jquery js files and Google logo images.
1. Implement DAO, create a package named DAO under SRC, and create a class named Db.java in it, which is as follows:
Package DAO;

Import java.sql.Connection;
Import Java.sql.DriverManager;
Import Java.sql.ResultSet;
Import java.sql.SQLException;
Import java.sql.Statement;

public class Db {
static {
try {
Class.forName ("Com.mysql.jdbc.Driver");
} catch (ClassNotFoundException e) {
E.printstacktrace ();
}
}
public static Connection getconnection () {
Connection con = null;
String url = "Jdbc:mysql://127.0.0.1:3306/test";
String userName = "root";
String pwd = "root";
try {
con = drivermanager.getconnection (URL, userName, pwd);
} catch (SQLException e) {
E.printstacktrace ();
}
return con;
}
Public ResultSet Getkeyword (String key) {
String sql = "Select name from the Google where name like \" "+key+"%\ "";
SYSTEM.OUT.PRINTLN (SQL);
Connection con = getconnection ();
ResultSet RS =null;
Statement stm = null;
try {
STM = Con.createstatement ();
rs = stm.executequery (SQL);
} catch (SQLException e) {
TODO auto-generated Catch block
E.printstacktrace ();
}
Return RS;
}


}
Method Getkeyword the fuzzy query by passing the keyword. Finally, the RS object is returned, and the result set is called when the action class
The object RS is converted to a list object and then the foreground JavaScript calls the output result.
Where the table Google creates statements are as follows:
CREATE TABLE Google (ID int primary KEY auto_increament,name varchar (+) not NULL);
Insert the data for the test:
Insert into Google (name) VALUES ("AAA");
Insert into Google (name) VALUES ("BBB");
Insert into Google (name) VALUES ("CCC");
Insert into Google (name) VALUES ("ABC");
Insert into Google (name) VALUES ("AREDSC");
Insert into Google (name) VALUES ("Sieln");
Insert into Google (name) VALUES ("ABA");


2. Implement action: The action class in the project implements a scheduled function. Create an action package in the SRC directory and create a name in the
The Keyaction.java class is as follows:
Package action;

Import Java.sql.ResultSet;
Import Java.sql.ResultSetMetaData;
Import java.sql.SQLException;
Import java.util.ArrayList;
Import Java.util.HashMap;
Import java.util.List;
Import Java.util.Map;
Import Com.opensymphony.xwork2.ActionSupport;
Import DAO. Db;
public class Keyaction extends Actionsupport {

Private static final long serialversionuid = 1L;
Public List GetName (String key) throws SQLException {
DB db = new db ();
ResultSet rs = Db.getkeyword (key);
List List = new ArrayList ();
ResultSetMetaData MD = Rs.getmetadata ();
int columnCount = Md.getcolumncount (); Map RowData;
while (Rs.next ()) {
Map rowdata = new HashMap ();
for (int i = 1; I <= columnCount; i++) {
Rowdata.put (Md.getcolumnname (i), rs.getobject (i));
}
List.add (RowData);
}
return list;
}
}
The main function of Keyaction.java is to dispatch the Db.java class to the layer, get the result set of the database query and convert the result set into a list object, by
DWR for JavaScript invocation. and use jquery to display it. As you can see, this action provides a GetName method that is based on the parameters (this parameter
The number is a query that is passed in from the View page via JavaScript) and the result set is converted to a list object for return.

index.jsp Implementation View:
<%@ page language= "java" import= "java.util.*" pageencoding= "UTF-8"%>
<! DOCTYPE HTML PUBLIC "-//w3c//dtd HTML 4.01 transitional//en" >
<title>struts2 Ajax google</title>
<script type= ' text/javascript ' src= '/struts2ajaxgoogle/dwr/engine.js ' ></script>
<script type= ' Text/javascript '
Src= '/struts2ajaxgoogle/dwr/interface/keywrod.js ' ></script>
<script type= "Text/javascript" src= "Jq/jquery-1.6.2.js" ></script>
<script type= "Text/javascript" >
$ (document). Ready (function () {
$ ("#serch"). KeyUp (function () {
var key = $ ("#serch"). Val ();
Keywrod.getname (key, callback);
});
function callback (date) {
var key = "";
for (i=0;i<date.length;i++) {
Key = key+date[i].name+ "<br>";
}
$ ("#result"). HTML ("<b>" +key+ "</b>");
}
});
</script>
<body>
<center>

<br>
<br>
<input type= "text" id= "Serch"
Style= "width:600px; height:38px; font-size:20px; font-weight:bold; "/>
<input type= "button" id= "sub" value= "Google Search" style= "height:40px"/><br/>
<div id= "Result" ></div>
</center>
</body>
jquery gets the input in the search box and then gives it to DWR. Dwr invokes the GetName method in the action and passes the arguments to the GetName method, and eventually the action
Return to DWR a list,dwr will give the list to jquery to show it.


Web. XML configuration:
<?xml version= "1.0" encoding= "UTF-8"?>
<web-app version= "2.5" xmlns= "Http://java.sun.com/xml/ns/javaee"
Xmlns:xsi= "Http://www.w3.org/2001/XMLSchema-instance"
Xsi:schemalocation= "Http://java.sun.com/xml/ns/javaee
Http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd ">
<servlet>
<servlet-name>dwr-invoker</servlet-name>
<servlet-class>org.directwebremoting.servlet.DwrServlet</servlet-class>
<init-param>
<param-name>debug</param-name>
<param-value>true</param-value>
</init-param>
</servlet>
<servlet-mapping>
<servlet-name>dwr-invoker</servlet-name>
<url-pattern>/dwr/*</url-pattern>
</servlet-mapping>

<filter>
<filter-name>struts2</filter-name>
<filter-class>
Org.apache.struts2.dispatcher.ng.filter.strutsprepareandexecutefilter</filter-class>
</filter>
<filter-mapping>
<filter-name>struts2</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
</web-app>


Dwr.xml configuration:
<?xml version= "1.0" encoding= "UTF-8"?>
<! DOCTYPE dwr Public "-//getahead limited//dtd Direct Web Remoting 3.0//en" "Http://directwebremoting.org/dwr/dwr30.dtd" >
<dwr>
<allow>
<create creator= "new" javascript= "Keywrod" >
<param name= "class" value= "action. Keyaction "/>
<include method= "GetName"/>
</create>
</allow>
</dwr>
Dwr.xml Specifies that the generated JavaScript name is keyword, which can be called by this name in the view's page to invoke the method in Keyaction.java. <include method= "GetName" >
Specifies that the GetName method can be called by DWR, and other accesses are not available. It's all done here.

Dwr and jquery implement bone keyword search

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.