最近搞的一個通訊錄想要加一個Ajax的自動完成功能，看起來功能雖小，可給用戶的體驗會改進不少。在一個介紹了幾十種java的Ajax框架的網頁里面，我找到了AjaxTags這個小東西，開始了我的第一次Ajax之旅。
從AjaxTags的官方網站上面http://ajaxtags.sourceforge.net/可以下載到其最新的版本，目前是AjaxTags1.3順便下載了一個官方的小例子看了看，確實很好阿，例子中使用Ajax完成了11種功能，然而我需要的是自動完成(autocomplete)部分的代碼，所以重點研究這一部分
jsp頁面中，首先當然是要添加AjaxTags的標簽支持，需要如下語句
Code
<%@ taglib uri="http://ajaxtags.org/tags/ajax" prefix="ajax"%>
然后在頁面中加入如下的標簽
Code
<ajax:autocomplete
source="model"//從控件"model"中獲得輸入的字符
target="make"//通過Ajax自動完成控件"make"的內容
baseUrl="${contextPath}/autocomplete.view"//Ajax執行時調用的請求路徑
className="autocomplete"//css類名
indicator="indicator"
minimumCharacters="1"//Ajax執行需要輸入的最小字符數
/>
在官方的例子中使用的是Servlet來完成Ajax，而對于使用struts就不適用了，后面說這個問題。
在 autocomplete.view對應的Servlet類中需要建立xml來供頁面調取，代碼如下
Code
public class AutocompleteServlet extends BaseAjaxServlet {
public String getXmlContent(HttpServletRequest request, HttpServletResponse response)
throws Exception {
String model = request.getParameter("model");//從頁面獲取控件"model"的輸入值
CarService service = new CarService();
List<Car> list = service.getModelsByName(model);//調用CarService的方法獲得汽車的List
// Create xml schema
return new AjaxXmlBuilder().addItems(list, "model", "make",true).toString();//生成xml
}
}
其實還是很簡單的，接下來看CarService的代碼吧，重點其實只有一段，然后在下面顯示出自動提示，于是可以把剛才的那個ajax標簽修改如下
Code
public class CarService {
private static List<Car> cars = new ArrayList<Car>();
static {
cars.add(new Car("Ford", "Escape"));
cars.add(new Car("Ford", "Expedition"));
cars.add(new Car("Ford", "Explorer"));
cars.add(new Car("Ford", "Focus"));
cars.add(new Car("Ford", "Mustang"));
cars.add(new Car("Ford", "Thunderbird"));
cars.add(new Car("Honda", "Accord"));
cars.add(new Car("Honda", "Civic"));
cars.add(new Car("Honda", "Element"));
cars.add(new Car("Honda", "Ridgeline"));
cars.add(new Car("Mazda", "Mazda 3"));
cars.add(new Car("Mazda", "Mazda 6"));
cars.add(new Car("Mazda", "RX-8"));
}//其實把上面這個地方改為數據庫查詢就可以從數據庫中得到List來供頁面顯示
public CarService() {
super();
}
public List<Car> getModelsByMake(String make) {
.
}
public List<Car> getModelsByName(String name) {
..
}
public List<Car> getAllCars() {
return cars;
}
}
例子看完了，開始實際操作吧，在我的頁面中，需要通過一個名為"name"的文本框輸入要查詢的人的姓名
Code
<ajax:autocomplete
source="name"
target="name"
baseUrl="ajaxfinduser.do"
className="autocomplete"
indicator="indicator"
minimumCharacters="1"
/>
接下來是我的Action，在寫Action的時候，我以為只需要把原來Servlet繼承的BaseAjaxServlet改為BaseAjaxAction就可以了，可后來才發現，jar包中根本就沒有BaseAjaxAction這個類，無語，去官方網站上看了后才知道，在1.2更新到1.3的時候，把對Struts的支持去掉了，如果想支持Struts的話需要建立自己的BaseAjaxAction
(Struts removed, to use it create your own BaseAjaxAction.java and implement BaseAjaxXmlAction then just call xml = AjaxActionHelper.invoke(this, request, response);)
下載了一份AjaxTags的源碼來看，原來AjaxActionHelper.invoke();這個方法需要調用Action中的getXmlContent方法來完成xml的寫入，那就好說了，代碼如下:
Code
package com.txl.action;
import java.io.IOException;
import java.util.List;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.ajaxtags.servlets.BaseAjaxXmlAction;
import org.ajaxtags.xml.AjaxXmlBuilder;
import org.apache.struts.action.Action;
import org.apache.struts.action.ActionForm;
import org.apache.struts.action.ActionForward;
import org.apache.struts.action.ActionMapping;
import org.ajaxtags.servlets.AjaxActionHelper;
import org.springframework.context.ApplicationContext;
import org.springframework.web.context.support.WebApplicationContextUtils;
import com.txl.service.AjaxFindUserService;
import com.vo.User;
public class AjaxFindUserAction extends Action implements BaseAjaxXmlAction {
public ActionForward execute(ActionMapping mapping, ActionForm form,
HttpServletRequest request, HttpServletResponse response)
throws IOException, Exception {
response.setCharacterEncoding("utf-8");
response.getOutputStream().print(new String(AjaxActionHelper.invoke(this, request, response).getBytes("UTF-8"),"ISO-8859-1"));//這里需要轉換編碼，不然無法支持中文查詢
response.getOutputStream().flush();
return null;
}
public String getXmlContent(HttpServletRequest request,
HttpServletResponse response) throws Exception {
String realname = request.getParameter("name");
ApplicationContext ctx = WebApplicationContextUtils
.getRequiredWebApplicationContext(servlet.getServletContext());//用ssh時需要在這里引入spring的配置文件,不然會在調用dao的時候報空指針異常
AjaxFindUserService service = (AjaxFindUserService) ctx
.getBean("AjaxFindUserService");
List<User> list = service.getUsersByRealname(realname);
return new AjaxXmlBuilder()
.addItems(list, "realname", "realname", true).toString();
}
}
剩下工作就是在struts-config.xml中配置對應的action，在spring中配置對應的bean就ok拉
--------------------------
09博客園紀念T恤新聞：
Office 2010雙拳出擊加強反盜版網站導航:
博客園首頁 個人主頁 新聞 社區 博問 閃存 找找看文章來源:
http://www.cnblogs.com/xiaoao808/archive/2008/09/22/1295661.html
posted on 2008-09-22 09:42
破名超難起 閱讀(209)
評論(0) 編輯 收藏