J2EE 0.7.2—用ajax实现像google那样的suggest-search功能(简化版)

cui09

浏览: 113483 次
性别:
来自: 吉林

最近访客更多访客>>

zjucor

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

J2EE系统更新档案

Google Ajax Struts SQL CSS

首先是需要建一个库。考虑可以这样。建立一个拼音的字段对应汉字的，用户打简拼即可查出汉字

sql 代码

create table `j2ee`.`suggest`(
`SUGGEST_ID` int not null auto_increment,
`TITLE` varchar(255),
primary key (`SUGGEST_ID`)
);

当然这里为了方便没有这样做。直接查title这个字段了。

其次是action了

java 代码

package org.perfect.struts.action;
import java.util.List;
import java.util.Map;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.apache.struts.action.ActionForm;
import org.apache.struts.action.ActionForward;
import org.apache.struts.action.ActionMapping;
import org.perfect.struts.dao.SearchSuggestDao;
import org.perfect.struts.form.LoginForm;
import org.perfect.struts.form.SearchSuggestForm;
public class SearchSuggestAction extends BasicDispatchAction {
private SearchSuggestDao searchSuggestDao;
public void setSearchSuggestDao(SearchSuggestDao searchSuggestDao) {
this.searchSuggestDao = searchSuggestDao;
}
public ActionForward execute(ActionMapping mapping, ActionForm form,
HttpServletRequest request, HttpServletResponse response)
throws Exception {
SearchSuggestForm searchSuggestForm = (SearchSuggestForm) form;
String action = request.getParameter("action");
action = (action == null || "".equals(action)) ? "init" : action;
return this.dispatchMethod(mapping, form, request, response, action);
}
public ActionForward init(ActionMapping mapping, ActionForm form,
HttpServletRequest request, HttpServletResponse response) {
SearchSuggestForm searchSuggestForm = (SearchSuggestForm) form;
return mapping.getInputForward();
}
//重点在这里
public ActionForward login(ActionMapping mapping, ActionForm form,
HttpServletRequest request, HttpServletResponse response)
throws Exception {
SearchSuggestForm searchSuggestForm = (SearchSuggestForm) form;
//由于我的Ajax水平比较初级，所以中文的问题搞了两个多小时，实现英文版的是很快的。
//这里必须得这样写。没有为什么。老外才不会管中国人的问题呢。
response.setCharacterEncoding("GBK");
response.setContentType("text/html");
response.setHeader("Cache-Control", "no-cache");
// new String(s.getBytes("iso8859-1"),"gbk");
String user_no = new String(request.getParameter("title").getBytes(
"iso8859-1"), "gbk");
System.out.println("user_no=" + user_no);
try {
if (!"".equals(user_no) && user_no != null) {
// String msg = "";
// select title from suggest where title like '%bc%'
//取到后拼个sql.用searchSuggestDao方法取出值放入LIST。
//searchSuggestDao直接继承自BaseDaoImp.里面没有代码，就不写了。
String sql = "select title from suggest where title like '%"
+ user_no + "%'";
System.out.println("sql=" + sql);
List list = searchSuggestDao.findForListBySql(sql);
StringBuffer sb = new StringBuffer();
for (int i = 0; i < list.size(); i++) {
Map map = (Map) list.get(i);
String key = map.get("title").toString();
//用"\n"分隔
sb.append(key + "\n");
}
System.out.println(sb.toString());
//传给页面，搞定了。
response.getWriter().write(sb.toString());
}
} catch (Exception e) {
e.printStackTrace();
}
return null;
}
}

最后是jsp了。有一点点儿麻烦

由于我的css同样很烂。所以这里就没考虑太多。为达到效果不则手段了。以后会改的好看一点。

合理一点。

css 代码

"http://www.w3.org/1999/xhtml">
"text/css" media="screen">
body {
font: 11px arial;
}
.suggest_link {
background-color: #FFFFFF;
padding: 2px 6px 2px 6px;
width: 573px;
}
.suggest_link_over {
background-color: #E8F2FE;
padding: 2px 6px 2px 6px;
width: 573px;
}
#search_suggest {
position: absolute;
background-color: #FFFFFF;
text-align: left;
border: 0px solid #8AABD5;
width: 575px;
cursor: hand;
}

不知道是我写的js烂，还是javaeye的功能有点小毛病。js发了四五回还是乱七八糟的。

真接发附件了。

xml 代码

<body onclick='hideSearchSuggest()'>
<html:form action="/searchSuggestAction" method="POST">
<bean:define id='form' name='searchSuggestForm' type='org.perfect.struts.form.SearchSuggestForm'>
bean:define>
<fieldset><table><tr>
<td class="free_input"><input type='text' name="title" size='80' onkeyup="testPrototype();" autocomplete="off"/>td>
<td><span style='font-size:12'>搜索span>td>
tr>table>
fieldset>
<div id="search_suggest">div>
html:form>
body>
html>