使用jQuery提交ajax表單，並接收另一個使用jQuery提交的表單

我正在創建一個應用程序，它將DOM對象作爲子對象添加到另一個DOM對象，並且此子對象可以具有子對象。我正在使用表單提交和驗證，如下所示。問題是，當我提交併接收AJAX響應時，我將新的表單添加到DOM，並且當它被提交時，它繞過initializeSubmit函數並加載一個新頁面。使用jQuery提交ajax表單，並接收另一個使用jQuery提交的表單

jQuery(document).ready(function($) { 
    $('#wpbody-content form').each(initializeSubmit); 
}); 

function initializeSubmit() { 
    var $ = jQuery, 
     $form = $(this), 
     options = { 
      submitHandler: function() { 
       var postdata = {}, 
        $inputs = $form.find('input, textarea'), 
        edit_fields = {}; 
       $inputs.each(function() { 
        // gather postdata 
       }); 
       $.ajax({ 
        type : 'POST', 
        dataType : 'html', 
        url : ajaxurl, 
        cache : false, 
        data : postdata, 
        success : function (response) { 
          $container = $form.parent(); 
          $container.after(response); 
          $newform = $(response).find('form'); 
          $newform.each(initializeSubmit); 
        } 
       }); 
      } 
     } 

    $form.validate(options); 
};

我也嘗試過使用申請，而不是每一個成功的函數中：

initializeSubmit.apply($newform);

控制檯日誌顯示一個jQuery數組$ newform內的適當形式。任何幫助表示讚賞！

來源

2012-12-02 johnrom

我認爲問題在於$(response).find('form')創建了一個與$container.after(response);插入的不同的DOM變換response。

您需要確保.find('form')作用於實際插入的DOM節點。

嘗試：目前爲裝載工作完美的網頁

success : function (response) { 
    var $response = $(response); 
    $form.parent().after($response); 
    $response.find('form').each(initializeSubmit); 
}

來源

2012-12-02 23:08:13

的形式。當表單被動態加載時，$（'form'）。each（initializeSubmit）不能正常工作。 – johnrom

好吧，我的壞。我剛剛完成了對答案的100％編輯。看看它是否更有意義。 –

良好的呼叫！現在像魅力一樣工作。 – johnrom

使用jQuery提交ajax表單，並接收另一個使用jQuery提交的表單

回答

相關問題