Как заставить AjaxForm работать с несколькими формами, загруженными с помощью jquery load ()? - PullRequest
2 голосов
/ 12 августа 2010

У меня есть страница с div, которая динамически заполняется с помощью paginator ;-) При инициализации страницы я загружаю в нее первые 10 форм, используя метод jquery .load ().

Я хотел бы сделать все формы динамически обновляемыми с помощью плагина AjaxForm. Я знаю о стороне сервера, давайте назовем это update.asp. Это работает.

Но есть несколько вопросов:

  1. Как заставить плагин работать в первую очередь, так как AjaxForm, кажется, не работает с фирмами внутри динамически загруженного div?

  2. Как идентифицировать и назвать формы? Теперь я использовал ID и имя myForm для всех из них (возможно, именно поэтому он не работает). Потому что, если я использую имя myForm1, myForm2 и т. Д. ... я должен написать 10 функций ajaxForm, которые я использую:

         $('#myForm').ajaxForm({
           beforeSubmit: showLoader,
           success: hideLoader
     }); 
    

Тогда мне нужно будет сделать это 10 раз, используя myForm1 to myForm10? Должен быть другой путь ...

  1. Как мне заставить AjaxForm работать со страницами, которые еще не загружены? Я думаю, что это та же проблема, что и 1). Поскольку даже страница 1 загружается динамически, ajaxForm не связывается с формой.

Извините, я новичок в jquery, я очень стараюсь его изучать, я пробовал это довольно давно, прежде чем написал здесь. Если бы вы могли мне помочь, я был бы очень благодарен.

Ваш

Jerry

РЕДАКТИРОВАТЬ: Вот мой загрузчик сейчас ... Он не работает нормально, так как загрузчик никогда не отображается, он исчезает так быстро, что я могу видеть его, только если я положил предупреждение в hideLoader: - (((

      function load(num){
      showLoader2();
      var link='/obdelaneslike.asp?ID=<%=request.QueryString("IDRecept") %>&offset='+ num
       $('#content').load(link, function(){
        hideLoader2();
        $('.ajax-loader').hide();

         $('.myForm').bind("submit", function(event) { 
                   $(this).ajaxForm({

               beforeSubmit: showLoader($(this).find('img.ajax-loader').attr('id')),
           success: hideLoader($(this).find('img.ajax-loader').attr('id'))

           }); 
           return false;
                  }); 

           });

       }

Ответы [ 2 ]

2 голосов
/ 12 августа 2010

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

1) Вы можете выполнить повторную привязку, когда вы .load() (или любой другой метод jQuery ajaxвы используете) или используйте плагин, такой как livequery(), например, здесь повторное связывание (сделайте это в вашем обработчике success):

$("#myDynamicDiv .myForm").ajaxForm({ ...options... }); 

Или используя livequery():

$(".myForm").livequery(function() { $(this).ajaxForm({ ...options... }); });

2) Используйте здесь класс вместо идентификаторов, например так: class="myForm", когда вы хотите обрабатывать партии элементов, подобных этойclass - довольно безопасный маршрут.Приведенные выше примеры работают с классом, а не с идентификаторами в форме (они могут иметь идентификаторы, но они просто не используются).Ваши теги формы будут выглядеть так:

<form class="myForm">

3) Те же решения в ответе № 1 объясняют это:)

1 голос
/ 12 августа 2010

Значения идентификатора уникальны для одного элемента DOM. Поэтому вам нужно присвоить каждой форме новый идентификатор, поэтому если у вас есть три формы, вы можете назвать их так:

<form name="formone" id="formone"...
<form name="formtwo" id="formtwo"...
<form name="formthree" id="formthree"...

Теперь вы создадите экземпляры вашего ajax-запроса следующим образом:

     $('#formone, #formtwo, #formthree').ajaxForm({
       beforeSubmit: showLoader,
       success: hideLoader
     }); 
...