Struts Ajax表單驗證

Question

我有一個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

但攔截 「jsonValidationWorkflowStack」 在struts-default.xml中缺少像寫在帖子：jsonValidationWorkflowStack seems to be removed in Struts 2.3.1

據源出到struts- json插件在struts-plugin.xml中。我不知道我怎麼可以直接使用，但我建立我自己的堆棧中的struts.xml：

<!-- 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對象一起使用，但我不確定。誰能幫忙？

Answer 1

你正在解決Struts2 Issue。升級到最新版本2.3.3或2.3.4，你的問題應該消失。

Answer 2

我猜想流結果和ajax在一起玩的不好。只需刪除目標 屬性即可。 - jogep

我不同意你，因爲AJAX的男高音沒有加載新的頁面，而是將任何東西加載到當前頁面，這就是爲什麼我使用AJAX提交按鈕。注意動作的用戶而不重新加載頁面本身。解決方法是使用javascript清除狀態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> 

它工作得很好。