How to return the multiple form value from single page
<p>I created the two Form with multiple form fields. Based on selection it shows the fields depends on the selection</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>$(document).ready(function(){

  $('select#select_btn').change(function(){
 
    var sel_value = $('option:selected').val();
 if(sel_value==0)
 {
  //Resetting Form 
  $("#form_submit").empty();
  $("#form1").css({'display':'none'});
 }
 else{
  //Resetting Form 
  $("#form_submit").empty();
  
  //Below Function Creates Input Fields Dynamically 
     create(sel_value);
  
  //appending submit button to form
  $("#form_submit").append(
  $("&lt;input/&gt;",{type:'submit', value:'Sumbit'})
  )
  } 
 }); 
 
function create(sel_value){
   for(var i=1;i&lt;=sel_value;i++)   
    {
    $("div#form1").slideDown('slow');
    
     $("div#form1").append(
  $("#form_submit").append(
  $("&lt;div/&gt;",{id:'head'}).append(
  $("&lt;h3/&gt;").text("Refer Form"+i)),
    $("&lt;h7/&gt;").text("Name: "),
  $("&lt;input/&gt;",  {type:'text', placeholder:'Name', name:'name_'+i}),
  $("&lt;br/&gt;"),
     $("&lt;br/&gt;"),
     $("&lt;h7/&gt;").text("Mobile No: "),
  $("&lt;input/&gt;", {type:'text', placeholder:'Mobile', name:'mobile'+i}),
  $("&lt;br/&gt;"),
     $("&lt;br/&gt;"),
         $("&lt;h7/&gt;").text("Email: "),
  $("&lt;input/&gt;", {type:'email', placeholder:'Email', name:'email_'+i}),
  $("&lt;br/&gt;"),
     $("&lt;br/&gt;"),
     $("&lt;h7/&gt;").text("City: "),
    $("&lt;select&gt;").append('&lt;option val="0"&gt;--Select--&lt;/option&gt;','&lt;option val="1"&gt;One&lt;/option&gt;','&lt;option val="2"&gt;Two&lt;/option&gt;','&lt;option val="3"&gt;Three&lt;/option&gt;','&lt;option val="4"&gt;Four&lt;/option&gt;','&lt;option val="5"&gt;Five&lt;/option&gt;'),
 $("&lt;br/&gt;"),
   $("&lt;br/&gt;"),
   $("&lt;h7/&gt;").text("Course: "),
    $("&lt;select&gt;").append('&lt;option val="0"&gt;--Select--&lt;/option&gt;','&lt;option val="1"&gt;One&lt;/option&gt;','&lt;option val="2"&gt;Two&lt;/option&gt;','&lt;option val="3"&gt;Three&lt;/option&gt;','&lt;option val="4"&gt;Four&lt;/option&gt;','&lt;option val="5"&gt;Five&lt;/option&gt;'),
  $("&lt;hr/&gt;"),
  $("&lt;br/&gt;")
                  ))
     }
 
 }
  
 
 
});</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"&gt;&lt;/script&gt;
&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"&gt;&lt;/script&gt;
&lt;div class ="container"&gt;
&lt;form  action="#" method="post"&gt;
   &lt;p&gt;Name:
        &lt;input type="text" name="Name" /&gt;
    &lt;/p&gt;
    &lt;p&gt;Email:
        &lt;input type="text" name="player_email" /&gt;
    &lt;/p&gt;
      &lt;p&gt;Mobile:
        &lt;input type="text" name="mobile" /&gt;
    &lt;/p&gt;
 &lt;/form&gt;
     &lt;p&gt; Refer:

&lt;div id="selected_form_code"&gt;
 &lt;select id="select_btn"&gt;
 &lt;option value="0"&gt;--Select--&lt;/option&gt;
 &lt;option value="1"&gt;One&lt;/option&gt;
 &lt;option value="2"&gt;Two&lt;/option&gt;
 &lt;option value="3"&gt;Three&lt;/option&gt;
 &lt;option value="4"&gt;Four&lt;/option&gt;
 &lt;option value="5"&gt;Five&lt;/option&gt;
 &lt;/select&gt;
 &lt;/div&gt;

 &lt;div id="form1"&gt; 
  &lt;form id="form_submit" action="#" method="post"&gt;
   &lt;!-- dynamic Registration Form Fields Creates here--&gt;
  &lt;/form&gt;
 &lt;/div&gt; 
&lt;!------ right side advertisement div -----------------&gt;

 
&lt;/div&gt;</code></pre>
</div>
</div>
</p>

<p>How to return the both form data? when try to print the value it shows the form data value in array but it did not print 1st form value. How to return all form field value.</p>