Multiple Jquery Different Form Selectors

I have two forms one and two, and based on which form is submitted I want to call a function based on that submitted value at the end of my logic. I want to know if I can retrieve

Solution 1:

Give a common name for the answers for each form. I named it as "answer"

<divclass="forms"><formclass="one"><inputtype="text"name="answer"><inputtype="submit"value="Submit"></form><formclass="two"><inputtype="text"name="answer"><inputtype="submit"value="Submit"></form></div>

Here is the script:

<script>
$('.forms > form').submit( function(){
   var data = $( this ).serializeArray();
   console.log(data); // gives the current data of the forms//using the data you can call whatever function you want using a switch statment
});
</script>

Solution 2:

if you want a single event approach try this but it really depend on what your functions ve to do

 $('.forms > form').submit( function(e){
   e.preventDefault();
   var formN = $('form').index(this);
   switch(formN){
     case0:
         alert("FUNCTION1");
       break;
     case1:
         alert("FUNCTION2");
       break;
     //and so on.....
   }
});

<scriptsrc="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><divclass="forms"><formclass="one"><inputtype="text"name="foo"><inputtype="submit"value="Submit"></form><formclass="two"><inputtype="text"name="boo"><inputtype="submit"value="Submit"></form></div>