は誤って私のASP.NET MVCアプリケーションのjQueryのコードに無限ループをコード化された私は、次のJavaScriptコードで、次のエラーを取得してい

Question

：これは私が誤って無限ループをコード化されたことを意味していること

RangeError: Maximum call stack size exceeded

私が想定しています私のJavaScriptに。このコードは、jQuery Validateを使用するASP.NET MVCアプリケーションのコードです。このコードの目的は、送信前にページにキャプチャされた画像を確認することです。

これは、基本的に、jQueryの検証と並行して行う必要のあるフロントエンドの検証です。私の唯一の選択肢は、フォームの送信時にこのコードを実行することです。特に、「送信」ボタンのクリックと送信の間に他のイベントは発生しないためです。コードは次のとおりです。

$('form').submit(function (e) { 
    e.preventDefault(); 
    //If Corporation is selected as business type 
    if ($('#businessStructure').val() == "Corporation") { 
     //Checks CEO signature present 
     if ($("#signImage").length == 0 || $("#signImage").attr("src") == "") { 
      alert("Please sign and save your signature in the CEO signature pad"); 
      $("#ceoError").show(); 
     } 
     else { 
      //all good, an image exists 
      $('form').submit(); 
     } 
    } 
    //If Sole Proprietor is selected as business type 
    else if ($('#businessStructure').val() == "SoleProprietor") { 
     //Checks CEO signature present 
     if ($("#signImage").length == 0 || $("#signImage").attr("src") == "") { 
      alert("Please sign and save your signature in the CEO signature pad"); 
      $("#ceoError").show(); 
     } 
     //Checks partner1 signature present 
     if ($("#signImage1").length == 0 || $("#signImage1").attr("src") == "") { 
      alert("Please sign and save your signature in the first partner signature pad"); 
      $("#partner1Error").show(); 
     } 
     else { 
      //all good, an image exists 
      $('form').submit(); 
     } 
    } 

    else { 
     //Checks CEO signature present 
     if ($("#signImage").length == 0 || $("#signImage").attr("src") == "") { 
      alert("Please sign and save your signature in the CEO signature pad"); 
      $("#ceoError").show(); 
     } 
     //Checks partner1 signature present 
     if ($("#signImage1").length == 0 || $("#signImage1").attr("src") == "") { 
      alert("Please sign and save your signature in the first partner signature pad"); 
      $("#partner1Error").show(); 
     } 
      //Checks partner2 signature present 
      if ($("#signImage2").length == 0 || $("#signImage2").attr("src") == "") { 
       alert("Please sign and save your signature in the second partner signature pad"); 
       $("#partner2Error").show(); 
      } 
      else { 
       //all good, an image exists 
       $('form').submit(); 
      } 
    } 
}); 

これは、MVCアプリフォームの提出を伴う同時イベントを初めて実行したときです。私が気付いていない別のアプローチがありますか？

Answer 1

他の人がコメントで述べたように、コード内のフォームでsubmitメソッドを呼び出すと、else条件を含めてコード全体が再度実行されます。これにより、submitが再度呼び出され、無限の送信が行われます。スクリプトがなるイベントは

else { 
      //all good, an image exists 
      $('form').submit(); 
     } 

この問題を解決するには、フォーム

<form action="someUrl" method="post"> 
    <button type="button" id="btn-save">Save</button> 
</form> 

と内部のボタンIDを使用してイベントを配線することができ

$("#btn-save").click(function(e){ 
    e.preventDefault(); 
    // your existing code 
}); 

フォームへの参照を取得するには、相対セレクタを使用してフォームを取得することをおすすめします。この場合、closest()メソッドは便利です

$("#btn-save").click(function(e){ 
    e.preventDefault(); 
    var $form = $(this).closest("form"); 

    if(yourValidationCodeGoesHere) 
    { 

    } 
    else 
    { 
    $form.submit(); 
    } 

});