Catch Multiple Ajax Responses

Question

I am submitting multiple forms which are generated dynamically, how can I catch the responses? I'll catch the response for single form submit using the form id:

// ajax response  
$("#formID").ajaxForm({
  dataType: 'json',
  success: function(response) {
    alert("Success");
  }
});

My html code is:

<form action="someAction.htm" id="formID" method="post">
  <input type ="text"/>
</form>

It is working fine. Now I want to do the same for dynamically geneated forms. Something like this:

<% for(int i=0;I,5;i++) %>
<form action="someAction.htm" id="formID" method="post">

In the generated HTML I can see that all form tags are getting genearated and request are going but I don't know how to catch the responses. Any suggestions?

Answer 1

You need unique form IDs, that is for sure. This part is from @fGo.

<% for(int i=0 ; i<2 ; i++) { %>
<form action="someAction.htm" id="formID_<%=i%>" method="post" class="myform">
</form>
<% } %>

And on document.ready:

$(".myform").ajaxForm({
 dataType: 'json',
 success: function(response) {
 alert("Success");
}
});

Answer 2

why don't do do this:

// ajax response  
$("#formID_0").ajaxForm({
  dataType: 'json',
  success: function(response) {
    alert("Success 0");
  }
});

and

$("#formID_1").ajaxForm({
  dataType: 'json',
  success: function(response) {
    alert("Success 1");
  }
});

to capture these forms

<% for(int i=0 ; i<2 ; i++) { %>
<form action="someAction.htm" id="formID_<%=i%>" method="post">
</form>
<% } %>

If you want however to have only one function to capture all request you will have a different selector. To check the potential selectors take a look at this: