BlockUIがフォーム検証の前に動作しない

Question

struts2-jqueryプラグインからsj：submitタグを使用して送信されているフォームがあります。送信ボタンには、validateFunctionとonAfterValidationTopicが設定されています。私はjQuery BlockUIを使用してフォームをブロックしようとしていますが、ユーザーがsj：submitを介してこのフォームを保存するときです。問題は、検証が完了するまでBlockUIがオンにならないことです。このフォームは非常に広範であり、検証には2番目の時間がかかるため、この時間のずれはユーザーにとって非常に顕著です。

BlockUIは、ボタンのonClickパラメータに追加されたjavascriptメソッドを介して呼び出されています。私は0にfadeInを設定しているので、同期して実行する必要があります。

ブロック・ポイントは、struts2-jqueryの検証メソッドの前にBlockUIが呼び出されたと判断しましたが、フォームが検証され、サブミットされるか、検証警告が表示されるまでブロックは表示されません。

私の操作順序は、onClickパラメータでUIをブロックし、struts2-jqueryプラグインで検証のためにフォームを送信してから、検証が失敗した場合にUIのブロックを解除するAfterValidationTopicを起動します。これらのすべての手順は、UIがブロックされていることを除いて、正しい順序で行われています。なぜこれが当てはまるのか、私は迷っている。 jquery.struts2.jsファイルの$ .blockUI呼び出しを$ .elem.click関数に同じ結果で追加しようとしました。 BlockUIが呼び出されていますが、私はそれを見ていません。

<sj:submit 
    button="true" 
    type="button" 
    id="save_button" 
    cssClass="btn bg-cobalt-300" 
    buttonIcon="icon-floppy-disk" 
    label="Save" 
    validate="true" 
    formIds="my_form" 
    onAfterValidationTopics="postValidation" 
    validateFunction="bootstrapValidation" 
    value="%{getText('global.save')}" 
    onClick="loadingMaskSave();" 
    /> 

とJSコード：

function loadingMaskSave() { 
    $.blockUI({ 
     fadeIn: 0 
    }); 
} 

$.subscribe('postValidation', function (event,data) { 
    if(event.originalEvent.formvalidate == false) { 
     $.unblockUI(); 
    } 
}); 

Answer 1

が、私は問題が何であったかを把握するために管理

は、ここに私のJSPです。 jquery.struts2.jsファイルのvalidateFormメソッドでは、フォームがajaxを介して同期的に検証のために送信されています。 ajaxSubmitのasyncパラメータはfalseに設定されています。これにより、検証が完了するまでブラウザが完全にロックされるため、BlockUIオーバーレイが表示されませんでした。これに対処するため、私はformsubmitメソッドの$ elem.click（）コードを更新しました。 AjaxSubmitは非同期で（asyncをtrueに設定して）起動し、検証後のトピックの処理とフォームの実際の送信はAjaxSubmitの完全なメソッドで処理されるようになりました。これにより、ブラウザがロックされなくなり、検証が始まる前にBlockUIオーバーレイが表示されるようになりました。

$elem.click(function(e) { 
    var form = $(self.escId(o.formids)), 
     orginal = {}; 
    orginal.formvalidate = true; 
    e.preventDefault(); 

    if (o.validate) { 
     var submit = true, 
      ajaxSubmitParams = {}; 

     if (!self.loadAtOnce) { 
      self.require("js/plugins/jquery.form" + self.minSuffix + ".js"); 
     } 

     ajaxSubmitParams.type = "POST"; 
     ajaxSubmitParams.data = { 
       "struts.enableJSONValidation": true, 
       "struts.validateOnly": true 
     }; 
     if (o.href && o.href !== '#') { 
      ajaxSubmitParams.url = o.href; 
     } 
     else { 
      ajaxSubmitParams.url = form[0].action; 
     } 

     if (o.hrefparameter) { 
      ajaxSubmitParams.url = ajaxSubmitParams.url + '?' + o.hrefparameter; 
     } 

     ajaxSubmitParams.cache = false; 
     //ajaxSubmitParams.forceSync = true; 
     ajaxSubmitParams.async = true; 

     ajaxSubmitParams.complete = function(request, status) { 
      var f = $(form[0]), 
       et = request.responseText, 
       errors; 
      if ($.isFunction(o.validateFunction)) { 
       if (et && et.length > 10) { 
        submit = false; 
        if(et.substring(0,2) === "/*") { 
         // Handle Validation Errors for all Struts2 versions until 2.2.3.1 
         errors = $.parseJSON(et.substring(2, et.length - 2)); 
        } 
        else { 
         errors = $.parseJSON(et); 
        } 
        o.validateFunction(f, errors); 
       } 
      } 
      else if (StrutsUtils !== undefined) { 
       StrutsUtils.clearValidationErrors(form[0]); 

       // get errors from response 
       if(et.substring(0,2) === "/*") { 
        errors = StrutsUtils.getValidationErrors(et); 
       } 
       else { 
        errors = StrutsUtils.getValidationErrors($.parseJSON(et)); 
       } 

       // show errors, if any 
       if (errors.fieldErrors || errors.errors) { 
        StrutsUtils.showValidationErrors(form[0], errors); 
        submit = false; 
       } 
      } 
      self.log('form validation : ' + submit); 
      orginal.formvalidate = submit; 

      if (o.onaftervalidation) { 
       $.each(o.onaftervalidation.split(','), function(i, topic) { 
        $elem.publish(topic, $elem, orginal); 
       }); 
      } 

      if(orginal.formvalidate) { 
       if (o.href && o.href != "#") { 
        form[0].action = o.href; 
       } 
       form.submit(); 
      } 
     }; 

     form.ajaxSubmit(ajaxSubmitParams); 
    } 

    return false; 
});