2016-11-23 3 views
0

これは私が同様のロジックを実行しますが、のsetIntervalせずにする必要があり、非常に悪いコード再利用可能なAjax呼び出し

です。

基盤5モーダルダイアログ

<span class="spanButton registration" data-reveal-id="addExternalRegistration">Add external registration</span> 

空のモーダル

<div id="addExternalRegistration" class="reveal-modal" data-reveal aria-hidden="true"> 

とjQueryを使って私は、フォームとの対話を満たしていますが明らかにこのボタンがあります。

Ajaxが成功した場合、フォームにエラーがあるとダイアログの内容が変更されます。 ここで物語が終わります。しかし、フォームが有効になる前に、xの提出物をカバーする必要があります。

setIntervalはメモリを削除します。これは私が知りたいことを示す単なる例です。

レスポンスは、エラーが発生した新しいフォームであり、侮辱されるべきではありません。ajaxリクエストとそのすべてをxサークルで送信する必要があります。

$('.registration').click(function() { 
      $('#addExternalRegistration').load("/dashboard/add-external-registration/{{ confName }}"); 

      setInterval(function() { 
       $('form[name="dashboard_conference_registration_form"]').on('submit', function (e) { 
        e.preventDefault(); 

        $.ajax({ 
         url: '/dashboard/add-external-registration/{{ confName }}', 
         method: 'POST', 
         data: $(this).serialize(), 
         success: function(response) { 
          $('#addExternalRegistration').html(response); 
         } 
        }); 
       }); 
      }, 3000); 
     }); 

答えて

0

古いトリックをします。

再帰呼び出し

これは時間

(理論であるため、メモリのリークの、残念ながら)のAJAXリクエストを無制限に送信する機能です。

var ajax = function() { 
      $('form[name="dashboard_conference_registration_form"]').on('submit', function (e) { 
       e.preventDefault(); 

       $.ajax({ 
        url: '/dashboard/add-external-registration/{{ confName }}', 
        method: 'POST', 
        data: $(this).serialize(), 
        success: function(response) { 
         $('#addExternalRegistration').html(function() { 
          return response; 
         }); 
         setTimeout(ajax(), 2000); 

        } 
       }); 
      }); 
     }; 

それから私は、提出に再帰を発射する再帰関数を呼び出します。

 $('.registration').click(function() { 
      $('#addExternalRegistration').load("/dashboard/add-external-registration/{{ confName }}", 
        // Wait until form is loaded at modal window 
        // And then do the logic 
        function() { 
         $('form[name="dashboard_conference_registration_form"]').on('submit', function (e) { 
          e.preventDefault(); 

          $.ajax({ 
           url: '/dashboard/add-external-registration/{{ confName }}', 
           method: 'POST', 
           data: $(this).serialize(), 
           success: function(response) { 
            $('#addExternalRegistration').html(function() { 
             return response; 
            }); 
            setTimeout(ajax(), 2000); 
           } 
          }); 
         }); 
        } 
      ); 

     }); 
関連する問題