struts2+jquery+ajax表单验证
1.提示json-default包不存在或拦截器jsonValidationWorkflowStack不存在？
解决：struts2-json-plugin-xxx.jar
2.每验证一次，错误信息就累加一次，出现重复？
解决：如果你整合了spring，请将相应bean的singleton设为false（spring中的bean默认为单例模式，导致前次验证产生的错误信息一直存在）
二、Demo1：使用xhtml主题的表单验证
1.struts.xml
[html]
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE struts PUBLIC
"-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"
"https://struts.apache.org/dtds/struts-2.0.dtd">
<struts>
<package name="admin" extends="json-default" namespace="/admin">
<action name="login" class="com.wogu.jwa.actions.IndexAction">
<result>/WEB-INF/views/login.jsp</result>
</action>
<action name="dologin" class="com.wogu.jwa.actions.LoginAction">
<result>/admin/index</result>
<result name="input">/WEB-INF/views/login.jsp</result>
<interceptor-ref name="jsonValidationWorkflowStack"/>
</action>
</package>
</struts>
2./WEB-INF/views/login.jsp
[html]
<%@ page pageEncoding="utf-8" contentType="text/html; charset=utf-8" %>
<%@ taglib prefix="s" uri="/struts-tags" %>
<!DOCTYPE html>
<html>
<head>
<title>struts2+jquery+Ajax表单验证 - WoguAdmin - power by wogu</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<!--加入/struts即请求的静态资源-->
<script type="text/javascript" src="${pageContext.request.contextPath}/struts/jwa/js/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/struts/jwa/js/jquery.form.js"></script>
<script language="JavaScript" src="${pageContext.request.contextPath}/struts/utils.js" type="text/javascript"></script>
<script language="JavaScript" src="${pageContext.request.contextPath}/struts/xhtml/validation.js" type="text/javascript"></script>
<s:head theme="xhtml" />
</head>
<body>
<s:form id="myform" theme="xhtml" namespace="/admin" action="dologin" method="post">
<s:textfield name="username" label="用户名"/>
<s:textfield name="password" label="密 码"/>
<s:submit value=" 登录 "/>
<s:reset value=" 清除 "/>
<!--只验证，Action类不会被执行到-->
<s:hidden name="struts.validateOnly" value="true"/>
<!--必须加入-->
<s:hidden name="struts.enableJSONValidation" value="true"/>
</s:form>
</body>
</html>
<script type="text/javascript">
jQuery('#myform').ajaxForm({
'success' : function(errorsObject) {
StrutsUtils.clearValidationErrors(myform);
if(errorsObject.fieldErrors) {
StrutsUtils.showValidationErrors(myform, errorsObject);
return false;
}
//validate success
}
});
</script>
3.com.wogu.jwa.actions.LoginAction
[java]
package com.wogu.jwa.actions;
import com.opensymphony.xwork2.ActionSupport;
public class LoginAction extends ActionSupport
{
private String username;
private String password;
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;
}
}
4.com/wogu/jwa/actions/LoginAction-validation.xml
[html]
<!DOCTYPE validators PUBLIC "-//Apache Struts//XWork Validator 1.0.2//EN" "https://struts.apache.org/dtds/xwork-validator-1.0.2.dtd">
<validators>
<field name="username">
<field-validator type="requiredstring">
<message>You must enter a name</message>
</field-validator>
</field>
<field name="password">
<field-validator type="requiredstring">
<message>You must enter a password</message>
</field-validator>
</field>
</validators>
5.访问127.0.0.1:8080/admin/login
三、demo2：灵活的表单验证
1.创建自定义主题classpath/template/jwa
1-1.classpath/template/jwa/theme.properties
[plain] view plaincopy
parent = simple
1-2.classpath/template/jwa/form-close.ftl
[html]
<#if parameters.validate == true>
<input type="hidden" name="struts.enableJSONValidation" value="true"/>
</#if>
<#if parameters.dynamicAttributes.validateOnly?default("false") == "true">
<input type="hidden" name="struts.validateOnly" value="true"/>
</#if>
<#include "/${parameters.templateDir}/simple/form-close.ftl" />
<#if parameters.validate == true>
<script type="text/javascript" src="${base}/struts/jwa/js/jquery.form.js"></script>
<script type="text/javascript" src="${base}/struts/jwa/js/validation.js"></script>
<script type="text/javascript">
$(document).ready(function() {
jQuery('#${parameters.id}').ajaxForm({
'success' : function(data, status, xhr, form) {
if(hasValidationErrors(data)) {
showValidationErrors(data, form);
} else {
location.href = form.attr('forward');
}
}
});
});
</script>
</#if>
1-3.classpath/template/jwa/js/validation.js
[javascript]
function hasValidationErrors(data) {
if(data.errors || data.fieldErrors)
return true;
else
return false;
}
function showValidationErrors(data, form) {
var formid = form.attr('id');
var actionErrorWrap = $('#'+form.attr('actionErrorId'));
var actionErrorWrapExist = actionErrorWrap.length > 0;
if(actionErrorWrapExist) {
actionErrorWrap.html('');
}
if(data.errors) {
for(var i in data.errors) {
if(!actionErrorWrapExist)
alert(data.errors[i]);
else
actionErrorWrap.append('<p>'+data.errors[i]+'</p>');
}
}
if(data.fieldErrors) {
for(var i in data.fieldErrors) {
var error = data.fieldErrors[i].toString();
var field = $('#'+formid+'_'+i);
var fieldErrorWrap = $('#'+field.attr('fieldErrorId'));
if(fieldErrorWrap.length > 0) {
fieldErrorWrap.html(error);
} else if(actionErrorWrapExist) {
actionErrorWrap.append('<p>'+error+'</p>');
} else {
alert(error);
}
}
}
}
2.创建com.wogu.jwa.AjaxAction
[java]
package com.wogu.jwa;
import java.util.*;
import com.opensymphony.xwork2.ActionSupport;
public class AjaxAction extends ActionSupport
{
public static final String AJAX = "ajax";
private Map<String, Object> ajaxErrors = new HashMap<String, Object>();
public Map<String, Object> getAjaxErrors() {
Collection<String> errors = getActionErrors();
if(errors.size() > 0) {
ajaxErrors.put("errors", errors);
}
Map<String, List<String>> fieldErrors = getFieldErrors();
if(fieldErrors.size() > 0) {
ajaxErrors.put("fieldErrors", fieldErrors);
}
return ajaxErrors;
}
}
3.struts.xml
[html]
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE struts PUBLIC
"-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"
"https://struts.apache.org/dtds/struts-2.0.dtd">
<struts>
<package name="admin" extends="json-default" namespace="/admin">
<action name="login" class="indexAction">
<result>/WEB-INF/views/login.jsp</result>
</action>
<action name="dologin" class="loginAction">
<result name="ajax" type="json">
<param name="root">ajaxErrors</param>
</result>
<result name="input">/WEB-INF/views/login.jsp</result>
<interceptor-ref name="jsonValidationWorkflowStack"/>
</action>
</package>
</struts>
4./WEB-INF/views/login.jsp
[html]
<%@ page pageEncoding="utf-8" contentType="text/html; charset=utf-8" %>
<%@ taglib prefix="s" uri="/struts-tags" %>
<!DOCTYPE html>
<html>
<head>
<title>struts+jquery+Ajax表单验证 - power by wogu</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link href="favicon.ico" rel="shortcut icon">
<link type="text/css" rel="stylesheet" href="${pageContext.request.contextPath}/struts/jwa/css/style.css">
<script type="text/javascript" src="${pageContext.request.contextPath}/struts/jwa/js/jquery-1.7.1.min.js"></script>
</head>
<body>
<s:form id="myform" theme="jwa" validate="true" actionErrorId="tip" namespace="/admin" action="dologin" method="post" forward="${pageContext.request.contextPath}/admin/index">
<p id="main">
<p id="login_box">
<ul>
<li>用户名：<s:textfield name="username"/></li>
<li>密 码：<s:textfield name="password"/></li>
<li style="padding-left:48px;">
<s:submit value=" 登录 " cssClass="btn"/>
<s:reset value=" 清除 " cssClass="btn"/>
</li>
<li style="padding-left:48px;"><a href="#"><img src="${pageContext.request.contextPath}/struts/jwa/images/top_qq_login1.gif" border="0" style="vertical-align:middle;"/></a></li>
</ul>
<p id="tip" style="color:#ffffff;line-height:20px;padding-top:20px;"/>
</p>
</p>
</s:form>
</body>
</html>
5.com.wogu.jwa.actions.LoginAction
[java]
package com.wogu.jwa.actions;
import com.wogu.jwa.AjaxAction;
import com.opensymphony.xwork2.ActionContext;
public class LoginAction extends AjaxAction
{
private String username;
private String password;
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 execute() {
if(username.equals("test") && password.equals("123456")) {
ActionContext.getContext().getSession().put("userid", "1");
} else {
addActionError(getText("loginAction.user_or_password.error"));
}
return AJAX;
}
}