快捷導(dǎo)航

ajax交互Struts2的action(客戶端/服務(wù)器端)

更新時(shí)間：2013年08月14日 17:52:46 作者：

本文為大家探討下ajax交互Struts2的action并有客戶端及服務(wù)器端代碼，感興趣的朋友可以參考下，希望對(duì)大家有所幫助

1.客戶端網(wǎng)頁代碼

 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=GB18030"> 
<title>檢測(cè)用戶名是否唯一</title> 
<script language="javascript"> 
function createRequest(url) { 
http_request = false; 
if (window.XMLHttpRequest) { // 非IE瀏覽器 
http_request = new XMLHttpRequest(); //創(chuàng)建XMLHttpRequest對(duì)象 
} else if (window.ActiveXObject) { // IE瀏覽器 
try { 
http_request = new ActiveXObject("Msxml2.XMLHTTP"); //創(chuàng)建XMLHttpRequest對(duì)象 
} catch (e) { 
try { 
http_request = new ActiveXObject("Microsoft.XMLHTTP"); //創(chuàng)建XMLHttpRequest對(duì)象 
} catch (e) { 
} 
} 
} 
if (!http_request) { 
alert("不能創(chuàng)建XMLHttpRequest對(duì)象實(shí)例！"); 
return false; 
} 
http_request.onreadystatechange = getResult; //調(diào)用返回結(jié)果處理函數(shù) 
http_request.open('GET', url, true); //創(chuàng)建與服務(wù)器的連接 
http_request.send(null); //向服務(wù)器發(fā)送請(qǐng)求 
} 
function getResult() { 
if (http_request.readyState == 4) { // 判斷請(qǐng)求狀態(tài) 
if (http_request.status == 200) { // 請(qǐng)求成功，開始處理返回結(jié)果 
document.getElementById("toolTip").innerHTML = http_request.responseText; //設(shè)置提示內(nèi)容 
document.getElementById("toolTip").style.display = "block"; //顯示提示框 
} else { // 請(qǐng)求頁面有錯(cuò)誤 
alert("您所請(qǐng)求的頁面有錯(cuò)誤！"); 
} 
} 
} 
function checkUser(userName) { 
if (userName.value == "") { 
alert("請(qǐng)輸入用戶名！"); 
userName.focus(); 
return; 
} else { 
//createRequest('http://10.65.9.181:8090/ajax/checkUser.jsp?user='+userName.value); 
createRequest('http://10.65.9.181:8090/ajax/checkUser.action?user=' 
+ userName.value); 
} 
} 
</script> 
<style type="text/css"> 
<!-- 
#toolTip { 
position: absolute; 
left: 331px; 
top: 39px; 
width: 98px; 
height: 48px; 
padding-top: 45px; 
padding-left: 25px; 
padding-right: 25px; 
z-index: 1; 
display: none; 
color: red; 
background-image: url(images/tooltip.jpg); 
} 
--> 
</style> 
</head> 
<body style="margin: 0px;"> 
<form method="post" action="" name="form1"> 
<table width="509" height="352" border="0" align="center" 
cellpadding="0" cellspacing="0" background="images/bg.gif"> 
<tr> 
<td height="54"> </td> 
</tr> 
<tr> 
<td height="253" valign="top"> 
<div style="position: absolute;"> 
<table width="100%" height="250" border="0" cellpadding="0" 
cellspacing="0"> 
<tr> 
<td width="18%" height="54" align="right" style="color: #8e6723"><b>用戶名：</b></td> 
<td width="49%"><input name="username" type="text" 
id="username" size="32"></td> 
<td width="33%"><img src="images/checkBt.jpg" width="104" 
height="23" style="cursor: hand;" 
onClick="checkUser(form1.username);"></td> 
</tr> 
<tr> 
<td height="51" align="right" style="color: #8e6723"><b>密碼：</b></td> 
<td><input name="pwd1" type="password" id="pwd1" size="35"></td> 
<td rowspan="2"> 
<div id="toolTip"></div> 
</td> 
</tr> 
<tr> 
<td height="56" align="right" style="color: #8e6723"><b>確認(rèn)密碼：</b></td> 
<td><input name="pwd2" type="password" id="pwd2" size="35"></td> 
</tr> 
<tr> 
<td height="55" align="right" style="color: #8e6723"><b>E-mail：</b></td> 
<td colspan="2"><input name="email" type="text" id="email" 
size="45"></td> 
</tr> 
<tr> 
<td> </td> 
<td colspan="2"><input type="image" name="imageField" 
src="images/registerBt.jpg"></td> 
</tr> 
</table> 
</div> 
</td> 
</tr> 
<tr> 
<td> </td> 
</tr> 
</table> 
</form> 
</body> 
</html> 

2.服務(wù)器端代碼
Action類的代碼

復(fù)制代碼代碼如下:

 
package com.action; 
import java.util.Map; 
import com.opensymphony.xwork2.ActionContext; 
import com.opensymphony.xwork2.ActionSupport; 
import com.xzy.UserDAO; 
public class CheckUserAction extends ActionSupport{ 
private String user; 
public String findUserByName(){ 
String info = null; 
UserDAO userdao = new UserDAO(); 
if(userdao.findUserByName(user)){ 
//info="用戶名已經(jīng)被注冊(cè)"; 
Map map = (Map)ActionContext.getContext().get("request"); 
map.put("info", "用戶名已經(jīng)被注冊(cè)"); 
return "success"; 
}else{ 
//info="用戶名可以注冊(cè)"; 
Map map = (Map)ActionContext.getContext().get("request"); 
map.put("info", "用戶名可以注冊(cè)使用"); 
return "fail"; 
} 
} 

public String getUser() { 
return user; 
} 

public void setUser(String user) { 
this.user = user; 
} 
} 

struts.xml配置

復(fù)制代碼代碼如下:

 
<?xml version="1.0" encoding="UTF-8" ?> 
<!DOCTYPE struts PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 2.1//EN" "http://struts.apache.org/dtds/struts-2.1.dtd"> 
<struts> 
<package name="myPackage" extends="struts-default"> 
<!-- 定義action --> 
<action name="checkUser" class = "com.action.CheckUserAction" method="findUserByName"> 
<!-- 定義處理成功后的映射頁面 --> 
<result >/info.jsp</result> 
</action> 
</package> 
</struts> 

info.jsp為顯示信息頁面

復(fù)制代碼代碼如下:

 
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> 
<%=request.getAttribute("info")%> 

info.jsp是jsp頁面，對(duì)于與安卓客戶端交互的jsp頁面而言，盡量略去不必要的html代碼，只需要保留控制編碼格式的代碼和<%%>之間的處理代碼,這樣就避免了在安卓客戶端顯示不必要的垃圾代碼，且提高了執(zhí)行效率，降低了服務(wù)器負(fù)載。
數(shù)據(jù)庫截圖: