jQuery: привязать ajaxForm к форме на странице, загруженной с помощью.load()

Я использую плагин ajaxForm для jQuery для отправки форм в мое веб-приложение. Тем не менее, в одной части приложения я загружаю некоторый контент, имеющий форму, через jQuery's .load()

Проблема заключается в том, что я не могу связать ajaxForm с формой, загруженной через ajax.

Я пробовал этот код безрезультатно:

 $('#viewRecordBtn').live('click', function() { // Handle the event when the 'view record' button is clicked
    $("#tab2").load('ajax/viewRecord.php'); // Load the record and the form into tab 2
    $('#formAddRecord').ajaxForm(formAddRecordOptions); // Bind the form
 });

Любая помощь очень ценится!


Редактировать: Спасибо, ребята! Это работает отлично.

4 ответа

Решение

Я думаю, что вы должны поместить код привязки в обратный вызов, потому что нагрузка асинхронная:

 $('#viewRecordBtn').live('click', function() { // Handle the event when the 'view record' button is clicked
    $("#tab2").load('ajax/viewRecord.php', function() {
                    $('#formAddRecord').ajaxForm(formAddRecordOptions); // Bind the form
               }); // Load the record and the form into tab 2    
 });

Если вы используете последний плагин jQuery Form и jQuery 1.7+, вы можете использовать опцию "делегирование", например:

$('#myForm').ajaxForm({
    delegation: true,
    target: '#output'
});

Это описано здесь: http://malsup.github.com/jquery.form.js

Это потому, что вы связываете ajaxForm в то время, когда .load() еще не завершена. попробуй это:

$('#tab2').load('ajax/viewRecord.php', function() {
  $('#formAddRecord').ajaxForm(formAddRecordOptions);
});
$('#viewRecordBtn').live('click', function() { 
   $("#tab2").load('ajax/viewRecord.php', function(){
       $('#formAddRecord').ajaxForm(formAddRecordOptions); // Bind the form
   }); // Load the record and the form into tab 2

});
Другие вопросы по тегам