jQuery में AJAX के माध्यम से फ़ॉर्म सबमिट करें

Question

मैं निम्नलिखित jQuery कोड का उपयोग AJAX के माध्यम से फ़ॉर्म सबमिट करने के लिए कर रहा हूं।

jQuery('form.AjaxForm').submit(function() {    
     $.ajax({ 
      url  : $(this).attr('action'), 
      type : $(this).attr('method'), 
      dataType: 'json', 
      data : $(this).serialize(), 
      success : function(data) { 
         alert('Submitted') 
         }, 
      error : function(xhr, err) { 
         alert(''Error);  
         } 
     });  
     return false; 
    }); 

कोड पूरी तरह से AJAX के साथ काम कर रहा है। लेकिन अगर मैं AJAX के माध्यम से फॉर्म लोड करता हूं तो काम नहीं करता है। मुझे लगता है कि जावास्क्रिप्ट लोड के बाद AJAX के माध्यम से फॉर्म लोड करने की वजह से है।

कोई समाधान?

Answer 1

यदि jQuery 1.7+ का उपयोग करना है तो आप ईवेंट को प्रतिनिधि बनाने के लिए .on() का उपयोग करने का प्रयास कर सकते हैं और उसी वर्ग के साथ सभी भावी रूपों में बाध्य कर सकते हैं। निकटतम माता-पिता को ढूंढने का प्रयास करें जो $ (दस्तावेज़) की बजाय गतिशील रूप से डाला नहीं गया है।

$(document).on('submit', 'form.AjaxForm', function() {    
     $.ajax({ 
      url  : $(this).attr('action'), 
      type : $(this).attr('method'), 
      dataType: 'json', 
      data : $(this).serialize(), 
      success : function(data) { 
         alert('Submitted'); 
      }, 
      error : function(xhr, err) { 
         alert('Error');  
      } 
     });  
     return false; 
    }); 

Answer 2

आप सीधे एचटीएमएल जो मौजूद नहीं है के लिए संचालकों अनुलग्न नहीं कर सकते

2 तरीके इसे संभाल करने के लिए कर रहे हैं।

एजेक्स की सफलता कॉलबैक के भीतर हैंडलर को बांधें।

$(formParentSelector).load(formFileUrl, function() { 
     /* within this success callback the new html exists and can run code*/ 
     AjaxForm(); 
    }); 

function AjaxForm(){ 
    jQuery('form.AjaxForm').submit(function() {    
     $.ajax({ 
      url  : $(this).attr('action'), 
      type : $(this).attr('method'), 
      dataType: 'json', 
      data : $(this).serialize(), 
      success : function(data) { 
         alert('Submitted'); 
         }, 
      error : function(xhr, err) { 
         alert('Error');  
         } 
     });  

              }) 
} 

दूसरी तरह के दस्तावेज़ में एक उच्च स्तर पर हैंडलर को सौंपने के लिए तो यह भविष्य के मिलान तत्वों

के लिए avalibale है

jQuery(document).on('submit','form.AjaxForm').submit(function() {    
     $.ajax({ 
      url  : $(this).attr('action'), 
      type : $(this).attr('method'), 
      dataType: 'json', 
      data : $(this).serialize(), 
      success : function(data) { 
         alert('Submitted'); 
         }, 
      error : function(xhr, err) { 
         alert('Error');  
         } 
     });  

              })