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

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

Проблема заключается в том, что я не могу заставить 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 ]

7 голосов
/ 05 февраля 2010

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

 $('#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    
 });
5 голосов
/ 04 июля 2012

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

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

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

1 голос
/ 05 февраля 2010

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

$('#tab2').load('ajax/viewRecord.php', function() {
  $('#formAddRecord').ajaxForm(formAddRecordOptions);
});
0 голосов
/ 05 февраля 2010
$('#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

});
...