`

AJAX提交Struts2表单(服务器端validation校验出错提示)

 
阅读更多

1.目标

   在基于Struts2的应用中，利用AJAX方式提交表单实现一个登陆验证Action，将服务器端验证结果展现在页面上

字段错误展示：

action 错误提示

2.技术实现

   利用struts2-jquery插件和struts2-json插件实现
3.实现步骤

   3.1依赖jar包

  除了struts2-core-2.2.3.jar包以外，还要下载两个jar包

  struts2-jquery-plugin-3.1.0.jar

  struts2-json-plugin-2.2.3.jar

  3.2编写登陆处理类Action

    这个Action和我们普通的Action没有任何区别

 

[java] view plaincopyprint?
  1. package com.crazycoder2010.struts2;  
  2.   
  3. import com.opensymphony.xwork2.ActionSupport;  
  4.   
  5. public class LoginAction extends ActionSupport {  
  6.     private static final long serialVersionUID = 6627313805146336838L;  
  7.     private String name;  
  8.     private String password;  
  9.     public String getName() {  
  10.         return name;  
  11.     }  
  12.     public void setName(String name) {  
  13.         this.name = name;  
  14.     }  
  15.     public String getPassword() {  
  16.         return password;  
  17.     }  
  18.     public void setPassword(String password) {  
  19.         this.password = password;  
  20.     }  
  21.     @Override  
  22.     public String execute() throws Exception {  
  23.         if(!("Kevin".equals(this.name)&&"111111".equals(this.password))){  
  24.             this.addActionError("Wrong!");  
  25.         }  
  26.         return INPUT;  
  27.     }  
  28. }  
   3.3为登陆程序添加验证文件LoginAction-Validation.xml(和LoginAction放置在同一个目录下)

 

 

[html] view plaincopyprint?
  1. <?xml version="1.0" encoding="UTF-8" ?>  
  2. <!DOCTYPE validators PUBLIC "-//OpenSymphony Group//XWork Validator 1.0.2//EN" "http://www.opensymphony.com/xwork/xwork-validator-1.0.2.dtd">  
  3. <validators>  
  4.     <field name="name">  
  5.         <field-validator type="requiredstring">  
  6.             <param name="trim">true</param>  
  7.             <message>Name is required.</message>  
  8.         </field-validator>  
  9.         <field-validator type="stringlength">  
  10.             <param name="minLength">2</param>  
  11.             <param name="maxLength">60</param>  
  12.             <message>Name must be between ${minLength} and ${maxLength} characters long.</message>  
  13.         </field-validator>  
  14.     </field>  
  15.     <field name="password">  
  16.         <field-validator type="requiredstring">  
  17.             <param name="trim">true</param>  
  18.             <message>Password is required.</message>  
  19.         </field-validator>  
  20.         <field-validator type="stringlength">  
  21.             <param name="minLength">2</param>  
  22.             <param name="maxLength">60</param>  
  23.             <message>Password must be between ${minLength} and ${maxLength} characters long.</message>  
  24.         </field-validator>  
  25.     </field>  
  26. </validators>  
3.4配置Action类struts.xml

 

这个Action的配置有些特殊，注意

   a.package需要继承自json-default包

   b.action的拦截器引用jsonValidationWorkflowStack

   c.result的type类型为json

   d.配置该action需要转化成json对象的字段includeProperties

 

[html] view plaincopyprint?
  1. <?xml version="1.0" encoding="UTF-8" ?>  
  2. <!DOCTYPE struts PUBLIC  
  3.   "-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"  
  4.   "http://struts.apache.org/dtds/struts-2.0.dtd">  
  5. <struts>  
  6.     <package name="default" extends="json-default">  
  7.         <action name="login" class="com.crazycoder2010.struts2.LoginAction">  
  8.             <interceptor-ref name="jsonValidationWorkflowStack"></interceptor-ref>  
  9.             <result name="input" type="json">  
  10.                 <param name="ignoreHierarchy">false</param>  
  11.                 <param name="includeProperties">actionErrors\[\d+\], fieldErrors\..+$, actionMessages\[\d+\]</param>  
  12.             </result>  
  13.         </action>  
  14.     </package>  
  15. </struts>  
3.5编写登陆页面login.jsp

 

   a.将struts2-jquery的taglib引入页面中

   b.在<head>元素中通过<sj:head/>标签引入jquery的css和js文件（这些文件都压缩在struts2-jquery-plugins.jar包中，因此不需要单独下载jquery相关的js了）

   c.提交submit按钮改用struts2-jquery插件中的

<sj:submit onCompleteTopics="complete"    --在服务器端处理完毕将结果返回到页面时所触发的javascript函数

targets="result"   --用来展示结果的容器ID列表，以','分割

onBeforeTopics='clearError'   --在将数据提交到服务器端以前所触发的javascript函数，如做一些客户端的验证错误提示信息的清除

返回json结果字符串示例：

{"actionErrors":[],"actionMessages":[],"fieldErrors":{"name":["Name is required."],"password":["Password is required."]}}

 

[html] view plaincopyprint?
  1. <%@ page language="java" contentType="text/html; charset=utf-8"  pageEncoding="utf-8"%>  
  2. <%@ taglib prefix="s" uri="/struts-tags"%>  
  3. <%@ taglib prefix="sj" uri="/struts-jquery-tags"%>  
  4. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
  5. <html>  
  6. <head>  
  7. <style type="text/css">  
  8.     .errorLabel{color: red;}  
  9. </style>  
  10. <sj:head jquerytheme="cupertino" ajaxcache="false" compressed="false"/>  
  11. </head>  
  12. <body>  
  13.     <s:form action="login" method="post" theme="simple" namespace="/">  
  14.         <ul id="errorMessages"></ul>  
  15.         <p>User Name:</p>  
  16.         <p><input name="name"/><span id="error_name"></span></p>  
  17.         <p>Password:</p>  
  18.         <p><input type="password" name="password"/><span id="error_password"></span></p>  
  19.         <sj:submit   
  20.             onCompleteTopics="complete"   
  21.             targets="result"   
  22.             onBeforeTopics="clearError"  
  23.             value="Login"/>  
  24.     </s:form>  
  25. <script type="text/javascript">  
  26.     $.subscribe('clearError', function(event,data) {  
  27.         $("#errorMessages").html("");  
  28.         $('.errorLabel').html('').removeClass('errorLabel');  
  29.     });  
  30.     $.subscribe('complete', function(event,data) {  
  31.         $("#errorMessages").html("");//先将上次认证的错误消息清除掉  
  32.         $('.errorLabel').html('').removeClass('errorLabel');  
  33.           
  34.         var json = $.parseJSON(event.originalEvent.request.responseText);  
  35.         if(json.actionErrors && json.actionErrors.length>0){//判断有没有actionErrors  
  36.             $.each(json.actionErrors,function(index,data){  
  37.                 $("#errorMessages").append("<li>"+data+"</li>");  
  38.             });  
  39.             return;  
  40.         }  
  41.         if(json.fieldErrors && !isEmpty(json.fieldErrors)){//判断有没有fieldError(LoginAction-validation.xml验证错误)  
  42.             $.each(json.fieldErrors,function(index,value){//index就是field的name,value就是该filed对应的错误列表，这里取第一个  
  43.                 $("#error_"+index).html(value[0]);  
  44.                 $("#error_"+index).addClass("errorLabel");  
  45.             });  
  46.             return;  
  47.         }  
  48.         alert("登陆成功");//既没有actionError有没有fieldError则登陆成功  
  49.     });  
  50.     function isEmpty(obj){//判断对象是否为空(处理Object obj = {}这种情况认为isEmpty=true)  
  51.         for(var p in obj){  
  52.             return false;  
  53.         }  
  54.         return true;  
  55.     }  
  56. </script>  
  57. </body>  
分享到：
| jquery小技巧
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    struts2实现服务器端校验示例

    在这个"struts2实现服务器端校验示例"中，我们将探讨如何在Struts2中实现高效的服务器端数据校验，并结合Dojo实现类似AJAX的实时验证。 首先，Struts2的校验框架是基于Action类的，每个Action类都可以关联一个或多...

    Struts2 校验器

    在Struts2中，可以使用`&lt;s:fielderror&gt;`标签显示服务器端验证错误。 3. **配置校验规则**：Struts2的校验规则可以通过XML或注解方式定义。XML方式通常在struts.xml或相应的action类配置文件中定义，而注解方式则...

    基于struts2和DWR的Ajax输入校验实例

    Struts2负责处理业务逻辑和数据校验，而DWR则作为桥梁，实现了客户端与服务器端的实时通信。这种组合使用不仅可以确保数据的准确性，还能提升Web应用的响应速度和用户满意度。通过深入理解这两个框架的机制，开发者...

    struts2入门教程

    ·Struts 2.0中实现表单数据校验（Validation） ·拦截器（Interceptor） ·Struts 2中实现IoC ·Struts 2中实现文件上传 ·Struts 2中的OGNL ·Strus 2的新表单标签的使用 ·Struts 2与AJAX ·Struts2分页 ...

    struts2 校验框架

    Struts2的校验框架允许开发者定义和实施输入验证规则，这些规则可以在客户端（浏览器端）或服务器端执行。客户端验证可以提供即时反馈，而服务器端验证则是防止恶意数据的关键防线。以下是对Struts2校验框架的一些...

    个人认为目前最完备的Struts2教程

    06 在Struts 2.0中实现表单数据校验（Validation） 07 Struts 2的基石——拦截器（Interceptor） 08 在Struts 2中实现IoC 09 在Struts 2中实现文件上传 10 在Struts 2中实现CRUD 11 Struts 2中的OGNL 12 Struts 2的...

    struts2.0中文教程

    06 在Struts 2.0中实现表单数据校验（Validation） 07 Struts 2的基石——拦截器（Interceptor） 08 在Struts 2中实现IoC 09 在Struts 2中实现文件上传 10 在Struts 2中实现CRUD 11 Struts 2中的OGNL 12 trus 2的新...

    Struts 2.0系列(MAX)

    在Struts 2.0中实现表单数据校验（Validation） Struts 2的基石——拦截器（Interceptor） 在Struts 2中实现IoC 在Struts 2中实现文件上传 在Struts 2中实现CRUD Struts 2中的OGNL Strus 2的新表单标志的使用 ...

    Struts2框架 jar JAVA开发 Struts2.jar架包 Struts2开发实例

    当用户提交表单时，Struts2会自动进行数据校验，如果校验失败，会将错误信息反馈给用户。 **国际化** Struts2支持多语言环境，开发者可以创建资源文件（如message.properties、message_en.properties等），存储不同...

    Struts2防止重复提交的解决方案

    ### Struts2防止重复提交的解决方案 #### 一、引言 在Web应用程序开发中，一个常见的问题是如何有效地防止表单的重复提交。这不仅能够提高用户体验，还能增强系统的安全性。Struts2作为一款广泛使用的Java Web应用...

    Struts2.0中文教程权威版

    06 在Struts 2.0中实现表单数据校验（Validation） 07 Struts 2的基石——拦截器（Interceptor） 08 在Struts 2中实现IoC 09 在Struts 2中实现文件上传 10 在Struts 2中实现CRUD 11 Struts 2中的OGNL 12 trus 2的新...

    struts2入门的学习资料.pdf

    - Struts2提供了一套完整的验证框架，允许开发者通过XML或注解方式定义验证规则，进行客户端和服务器端的数据校验。错误信息可以通过`&lt;s:fielderror&gt;`标签显示。 7. **文件上传**： - Struts2提供了内置的支持...

    struts2代码演示

    - Struts2提供了强大的表单验证功能，可以在Action类中定义校验规则，也可以使用XML配置文件。 10. **Ajax支持** - Struts2通过JSON结果类型和dojo插件支持Ajax请求，实现局部刷新。 通过这个压缩包中的代码示例...

    Struts2 in action中文版+配套源代码

    8. **表单验证**：Struts2的Validation框架允许在Action类或XML文件中定义验证规则，对用户输入进行校验，保证数据的准确性。 9. ** strut2-dojo-plugin**：这个插件结合Dojo JavaScript库，为应用提供富客户端交互...

    浪曦\浪曦_Struts2应用开发系列_第1讲

    - **安装与环境搭建**：首先，你需要设置Java环境和Apache Tomcat服务器，然后通过Maven或手动方式将Struts2的依赖添加到项目中。 - **创建第一个Struts2应用**：创建一个简单的Hello World程序，了解Action类、...

    struts2输入验证例子

    默认情况下，Struts2提供了两种验证方式：服务器端验证和客户端验证。服务器端验证发生在后台，通常在Action类中，而客户端验证则在用户浏览器中通过JavaScript进行，提供了更好的用户体验，因为它可以即时反馈错误...

    struts2中文学习资料

    "在Struts 2_0中实现表单数据校验（Validation）" 介绍了Struts2的内置数据校验机制，这包括编写校验规则，使用FieldError处理错误，以及如何在视图层显示这些错误。 4. **转换器(Converter)**： "转换器...

    struts2全部资源包

    5. **强大的表单验证（Form Validation）**：提供了基于注解或XML的验证机制，可以方便地进行客户端和服务器端的数据校验。 6. **国际化（Internationalization, i18n）**：支持多语言环境，允许开发者轻松添加新的...

Magicbox
Global site tag (gtag.js) - Google Analytics