Struts ajax表单验证

时间:2012-05-03 14:28:17

标签: json jquery struts2 struts-validation

我遇到了ajax表单验证问题。我正在使用struts-core 2.3.1.2,struts-jquery-plugin 3.3.0和struts-json-plugin。

如果ajax请求提交ajax表单并且验证失败,则会出现问题。因此整个表单将放在结果元素上。因此,您可以在ajax sumbit按钮上激活ajax验证。 http://code.google.com/p/struts2-jquery/wiki/Validation

这里也有过时的信息: http://struts.apache.org/2.2.3.1/docs/ajax-validation.html

但struts-default.xml中缺少拦截器“jsonValidationWorkflowStack”,如帖子所示:jsonValidationWorkflowStack seems to be removed in Struts 2.3.1

它来源于struts-plugin.xml中的struts-json-plugin。我不知道如何直接使用它,但我在struts.xml中构建自己的Stack:               

<!-- Sample JSON validation stack  -->
<interceptor-stack name="jsonValidationWorkflowStack">
            <interceptor-ref name="basicStack"/>
            <interceptor-ref name="validation">
                <param name="excludeMethods">input,back,cancel</param>
            </interceptor-ref>
            <interceptor-ref name="jsonValidation"/>
            <interceptor-ref name="workflow"/>
        </interceptor-stack> 
    </interceptors>
<action name="updateMySettings" method="execute" class="de.ra.daod.actions.MyAppSettingAction">
        <interceptor-ref name="jsonValidationWorkflowStack"/>
                    <!-- This is not beauty within ajax -->
        <result name="input">/WEB-INF/jsp/mysetting_ajax.jsp</result>
        <result name="success" type="stream">
            <param name="contentType">text/html</param>
            <param name="inputName">inputStream</param>
        </result>
    </action>

我的表格如下:

<s:head />
<sj:head />
    <!-- This files are needed for AJAX Validation of XHTML Forms -->
    <script src="${pageContext.request.contextPath}/struts/xhtml/validation.js" type="text/javascript"></script>

<s:form id="form" action="private/updateMySettings" theme="xhtml">
                <s:textfield id="screenRes" key="appSetting.screenResolution" label="Screen resolution" required="true" />
<s:select key="appSetting.screenDepth" label="Color depth" list="#{'8':'8','16':'16','24':'24'}" required="true" />
<sj:submit value="Update Settings" targets="status" validate="true"/>
            </s:form>

不幸的是,如果验证失败,我会收到javascript错误:

Uncaught TypeError: Object #<Object> has no method 'indexOf'
f.extend.ajax  jquery-1.7.1.min.js:4
b.fn.ajaxSubmit
a.struts2_jquery.validateForm  jquery.struts2-3.3.0.min.js:18
a.subscribeHandler.h.beforeSubmit  jquery.struts2-3.3.0.min.js:18
b.fn.ajaxSubmit
a.subscribeHandler.e  jquery.struts2-3.3.0.min.js:18
e.extend.each  jquery-1.7.1.min.js:2
a.subscribeHandler.e  jquery.struts2-3.3.0.min.js:18
f.event.dispatch  jquery-1.7.1.min.js:3
f.event.add.h.handle.i  jquery-1.7.1.min.js:3
f.event.trigger  jquery-1.7.1.min.js:3
f.fn.extend.trigger  jquery-1.7.1.min.js:3
e.extend.each  jquery-1.7.1.min.js:2
e.fn.e.each  jquery-1.7.1.min.js:2
f.fn.extend.trigger  jquery-1.7.1.min.js:3
d.fn.extend.publish  jquery.subscribe.min.js:16
e.extend.each  jquery-1.7.1.min.js:2
d.fn.extend.publish  jquery.subscribe.min.js:16
(anonymous function)  jquery.struts2-3.3.0.min.js:18
f.event.dispatch  jquery-1.7.1.min.js:3
f.event.add.h.handle.i  jquery-1.7.1.min.js:3

似乎无法处理来自响应的json对象,我不知道为什么导致我遵循旧指令。我假设原因是来自struts / utils.js的StrutsUtils.getValidationErrors函数,如果此函数与json对象一起使用但我不确定。有人可以帮忙吗?

2 个答案:

答案 0 :(得分:1)

我猜流结果和ajax不能很好地结合在一起。只需删除目标 属性。 - jogep

我不同意你的观点,因为AJAX的主题并没有加载新页面,而是加载了当前页面的任何内容,这就是我使用AJAX提交按钮的原因。要注意操作的用户而不重新加载页面本身。解决方法是使用javascript清除status div元素的内容。我认为这可以在struts2-jquery-plugin中自动完成。这是我的表单,它嵌入在选项卡式窗格中。

<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags" %>
<%@ taglib prefix="sj" uri="/struts-jquery-tags"%>

<s:if test="appSetting != null">
<h3>Application settings</h3>
<div id="status" class="welcome"></div> 
<table>
    <tr>
        <td>
            <s:form id="form" action="updateMySettings" theme="xhtml">
                <s:textfield id="screenRes" key="appSetting.screenResolution"
                    label="Screen resolution" required="true" />
                <s:select key="appSetting.screenDepth" label="Color depth"
                    list="#{'8':'8','16':'16','24':'24'}" required="true" />
                <sj:submit id="updateSetting" value="Update Settings" targets="status" validate="true" />
            </s:form>
        </td>
        <td valign="top">
            <button id="fullScreen">Use full screen</button>
            <button id="fullBrowser">Use full browser</button>
        </td>
    </tr>
</table>
<script>
$("#fullScreen").click(function() {
    scr_width = Math.max(screen.width,screen.height);
    scr_height = Math.min(screen.width,screen.height);
    $("#screenRes").val(scr_width + 'x' + scr_height);
});
$("#fullBrowser").click(function() {
    brw_width = Math.max(window.innerWidth, window.innerHeight);
    brw_height = Math.min(window.innerWidth, window.innerHeight);
    $("#screenRes").val(brw_width + 'x' + brw_height);
});
$("#updateSetting").click(function() {
    $("#status").empty();
})
</script>
</s:if>
<s:else>
<p>No settings available.</p>
</s:else>

效果很好。

答案 1 :(得分:0)

您已经解决了Struts2 Issue。升级到最新版本2.3.3或2.3.4,您的问题应该消失。