天易28----struts2.1和ajax json的简单使用

一：效果预览

说明：这里没有做任何样式的布局，只是简单的实现功能而已

1）用户名和密码都为空：




2）用户名和密码不正确：




3）用户名和密码输入正确：

二：代码演示：

1）项目目录演示：



2）action代码（为了方便这里用户名和密码是固定写死的，没有访问数据库，可根据需要连接数据库进行用户名校验）：

package com.test.action;

import com.opensymphony.xwork2.ActionSupport;
import com.test.bean.AjaxBean;

public class AjaxLoginAction extends ActionSupport{

private String method;
private String info;
private AjaxBean ab;
public String execute() {
String url = "fail";
try{
if("login".equals(this.getMethod())){
url=this.login();
}
}catch(Exception err){
err.printStackTrace();
}
return url;
}

/**
* json登陆测试
* @return String
*/
private String login(){
//System.out.println("name and pass11111===================>>>>>>>"+ab.getUsername()+" "+ab.getPassword());
if((ab.getUsername()==null || ab.getUsername().equals("")) || (ab.getPassword()==null || ab.getPassword().equals(""))){
this.setInfo("用户名或密码为空,请填写用户名或密码!");
}
else if(!ab.getUsername().equals("wzh") || !ab.getPassword().equals("123")){
this.setInfo("用户名或密码输入有误,请输入正确的用户名和密码！");
}else{
this.setInfo("登陆成功！");
}
return "loginsuccess";
}

public String getMethod() {
return method;
}

public void setMethod(String method) {
this.method = method;
}

public String getInfo() {
return info;
}

public void setInfo(String info) {
this.info = info;
}

public AjaxBean getAb() {
return ab;
}

public void setAb(AjaxBean ab) {
this.ab = ab;
}

}

3）实体类bean代码（为了方便将username和password两个参数放到原有的实体类里，这里只用username和password两个即可）：

package com.test.bean;

import java.io.Serializable;

public class AjaxBean implements Serializable {

private String id;
private String sfdm;
private String sflbbh;
private String ywmc;
private String xz;
private String rksj;
private String gxsj;
private String zt;
private String fplb_id;
private String zdyflag;
private String msfbz;
private String bm;
private String jmbz;
private String sfbz;

private String username;
private String password;
//组装sql语句
public String getWhere() {
// TODO Auto-generated method stub
StringBuffer sql = new StringBuffer(" WHERE 1=1 ");
if(sfdm!=null&&!"".equals(sfdm.trim())){
sql.append(" AND SFDM = '"+sfdm+"'");
}if(ywmc!=null&&!"".equals(ywmc.trim())){
sql.append(" AND YWMC LIKE '%"+ywmc+"%'");
}

return sql.toString();

}

public String getUsername() {
return username;
}
public void setUsername(String username) {
this.username = username;
}

public String getPassword() {
return password;
}

public void setPassword(String password) {
this.password = password;
}

public String getId() {
return id;
}
public void setId(String id) {
this.id = id;
}
public String getSfdm() {
return sfdm;
}
public void setSfdm(String sfdm) {
this.sfdm = sfdm;
}
public String getSflbbh() {
return sflbbh;
}
public void setSflbbh(String sflbbh) {
this.sflbbh = sflbbh;
}
public String getYwmc() {
return ywmc;
}
public void setYwmc(String ywmc) {
this.ywmc = ywmc;
}
public String getXz() {
return xz;
}
public void setXz(String xz) {
this.xz = xz;
}
public String getRksj() {
return rksj;
}
public void setRksj(String rksj) {
this.rksj = rksj;
}
public String getGxsj() {
return gxsj;
}
public void setGxsj(String gxsj) {
this.gxsj = gxsj;
}
public String getZt() {
return zt;
}
public void setZt(String zt) {
this.zt = zt;
}
public String getFplb_id() {
return fplb_id;
}
public void setFplb_id(String fplb_id) {
this.fplb_id = fplb_id;
}
public String getZdyflag() {
return zdyflag;
}
public void setZdyflag(String zdyflag) {
this.zdyflag = zdyflag;
}
public String getMsfbz() {
return msfbz;
}
public void setMsfbz(String msfbz) {
this.msfbz = msfbz;
}
public String getBm() {
return bm;
}
public void setBm(String bm) {
this.bm = bm;
}
public String getJmbz() {
return jmbz;
}
public void setJmbz(String jmbz) {
this.jmbz = jmbz;
}
public String getSfbz() {
return sfbz;
}
public void setSfbz(String sfbz) {
this.sfbz = sfbz;
}

}

4）struts.xml配置文件（这里我用的是引进的配置文件struts-system.xml,这里只看下面ajax json的配置即可）

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE struts PUBLIC
"-//Apache Software Foundation//DTD Struts Configuration 2.1.7//EN"
"http://struts.apache.org/dtds/struts-2.1.7.dtd">
<struts>
<package name="ajaxtestwzh" namespace="/" extends="global">
<action name="ajaxtest" class="ajaxAction">
<result name="selectDataSuccess">/WEB-INF/jsp/ajaxTestList.jsp</result>
</action>
</package>

<!-- 使用ajax json异步交互测试的配置开始 -->
<package name="default" namespace="/" extends="json-default"><!-- 这里注意包名的配置 -->
<action name="loginjsontest" class="loginjsonAction">
<!-- 返回单个值的result -->
<result name="loginsuccess" type="json"></result>
</action>
</package>
<!-- 使用ajax json异步交互测试的配置结束 -->
</struts>

5）applicationContext.xml配置文件（只看最下面的ajax json的配置即可）

<?xml version="1.0" encoding="UTF-8"?>
<beans
xmlns="http://www.springframework.org/schema/beans"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:p="http://www.springframework.org/schema/p"
xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans-3.0.xsd"> <!-- 数据源配置 -->

<bean id="sfdataSource"
class="org.apache.commons.dbcp.BasicDataSource"
destroy-method="close">
<property name="driverClassName"
value="oracle.jdbc.driver.OracleDriver">
</property>
<property name="url"
value="jdbc:oracle:thin:@192.168.1.8:1521:ORCL">
</property>
<property name="username" value="azc2012"></property>
<property name="password" value="azc2012"></property>
<property name="maxActive" value="300"></property>
<property name="maxIdle" value="20"></property>
<property name="maxWait" value="1000"></property>
<property name="removeAbandoned" value="true"></property>
<property name="removeAbandonedTimeout" value="360"></property>
<property name="logAbandoned" value="true"></property>
<property name="defaultAutoCommit" value="true"></property>
</bean>
<bean id="ajaxjdbctemplate" class="org.springframework.jdbc.core.JdbcTemplate" abstract="false" lazy-init="default" autowire="default">
<property name="dataSource">
<ref local="sfdataSource" />
</property>
</bean>

<!-- 测试配置开始 -->
<bean id="ajaxAction" class="com.test.action.AjaxTest" scope="prototype">
<property name="asService" ref="asService"></property>
</bean>

<bean id="asService" class="com.test.service.impl.AjaxServiceImpl" scope="prototype">
<property name="adDao" ref="adDao"></property>
</bean>
<bean id="adDao" class="com.test.dao.AjaxDao" scope="prototype">
<property name="ajaxjdbctemplate" ref="ajaxjdbctemplate"></property><!-- 这里如果使用ajaxjdbctemplate那么需要在dao层生成它的get和set方法，并且不用继承JdbcDaoSupport这个类;
如果直接使用<property name="dataSource" ref="dataSource"></property>则不用再在dao层声明直接继承JdbcDaoSupport这个类调用该类访问数据库的方法即可 -->
</bean>
<!-- 测试配置结束 -->

<!-- ajax json配置开始 -->
<bean id="loginjsonAction" class="com.test.action.AjaxLoginAction" scope="prototype">
</bean>
<!-- ajax json配置结束 -->
</beans>

6）login.jsp页面（需要引进jquery.js和login.js(自己所写的js)）

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jstl/core_rt" prefix="c"%>
<%@ taglib prefix="s" uri="/struts-tags" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<html>
<head>
<base href="<%=basePath%>">
<title>ajax测试查询</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<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="<%=basePath%>jslib/jquery-1.4.js"></script>
<script type="text/javascript" src="<%=basePath%>jslib/jquery.js"></script>
<script type="text/javascript" src="<%=basePath%>js/login.js"></script>

</head>
<BODY>
<form action="" name="formName" method="post" style="margin:0px" id="formName" theme="simple">
<table border="0" width="99%" cellspacing="0" cellpadding="0" id="maintb" align="center">
<tr>
<td align="center">
<table width="100%"  border="0"  cellspacing="0" cellpadding="0" id="mainbox" style="background:url(images/usermessage_02.gif); background-repeat:repeat-x; margin-top:5px;" >
<tr>
<td colspan="3">
<table width="100%" border="0" cellpadding="0" cellspacing="0"   style="border-collapse:collapse;" id="tj" align="center">
<tr>
<td>
用户名：
<input type="text" id="usernameId"><label></label><br/>
密   码：
<input type="text" id="passId"><label></label><br/>
<input type="button" id="ywmcId" value=" 登 陆 " onclick="login()"/>
<br/>

<div id="message"></div>

</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</form>
<!--页面主体内容开始-->
<!--查询条件-->
<!--查询结果-->

</body>
</html>

7）login.js代码：

function login(){
var username=$("#usernameId").val();
var userpass=$("#passId").val();
$.getJSON("loginjsontest.action?method=login&ab.username="+username+"&ab.password="+userpass,function(data){
//$.getJSON("loginjsontest.action?method=login","ab.username="+username+"&ab.password="+userpass,function(data){ //另一种传参形式
//通过.操作符可以从data.message中获得Action中info的值
$("#message").html("<font color='red'>"+data.info+"</font>");
});
}