So geben Sie den Mehrfachformularwert von einer einzelnen Seite zurück

Question

Ich habe zwei Formulare mit mehreren Formularfeldern erstellt. Basierend auf Auswahl zeigt es die Felder auf der Auswahl

$(document).ready(function(){ 
 

 
\t $('select#select_btn').change(function(){ 
 
\t 
 
    var sel_value = $('option:selected').val(); 
 
\t if(sel_value==0) 
 
\t { 
 
\t \t //Resetting Form 
 
\t \t $("#form_submit").empty(); 
 
\t \t $("#form1").css({'display':'none'}); 
 
\t } 
 
\t else{ 
 
\t \t //Resetting Form 
 
\t \t $("#form_submit").empty(); 
 
\t \t 
 
\t \t //Below Function Creates Input Fields Dynamically 
 
\t  create(sel_value); 
 
\t \t 
 
\t \t //appending submit button to form 
 
\t \t $("#form_submit").append(
 
\t \t $("<input/>",{type:'submit', value:'Sumbit'}) 
 
\t \t) 
 
\t \t } \t 
 
\t }); \t 
 
\t 
 
function create(sel_value){ 
 
    for(var i=1;i<=sel_value;i++) 
 
\t { 
 
\t $("div#form1").slideDown('slow'); 
 
\t  
 
\t  $("div#form1").append(
 
\t \t $("#form_submit").append(
 
\t \t $("<div/>",{id:'head'}).append(
 
\t \t $("<h3/>").text("Refer Form"+i)), 
 
    $("<h7/>").text("Name: "), 
 
\t \t $("<input/>", {type:'text', placeholder:'Name', name:'name_'+i}), 
 
\t \t $("<br/>"), 
 
    \t $("<br/>"), 
 
    $("<h7/>").text("Mobile No: "), 
 
\t \t $("<input/>", {type:'text', placeholder:'Mobile', name:'mobile'+i}), 
 
\t \t $("<br/>"), 
 
    \t $("<br/>"), 
 
     $("<h7/>").text("Email: "), 
 
\t \t $("<input/>", {type:'email', placeholder:'Email', name:'email_'+i}), 
 
\t \t $("<br/>"), 
 
    \t $("<br/>"), 
 
    $("<h7/>").text("City: "), 
 
    $("<select>").append('<option val="0">--Select--</option>','<option val="1">One</option>','<option val="2">Two</option>','<option val="3">Three</option>','<option val="4">Four</option>','<option val="5">Five</option>'), 
 
\t $("<br/>"), 
 
    \t $("<br/>"), 
 
    $("<h7/>").text("Course: "), 
 
    $("<select>").append('<option val="0">--Select--</option>','<option val="1">One</option>','<option val="2">Two</option>','<option val="3">Three</option>','<option val="4">Four</option>','<option val="5">Five</option>'), 
 
\t \t $("<hr/>"), 
 
\t \t $("<br/>") 
 
\t     )) 
 
\t  } 
 
\t 
 
\t } 
 
    
 
\t 
 
\t 
 
});

<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div class ="container"> 
 
<form action="#" method="post"> 
 
    <p>Name: 
 
     <input type="text" name="Name" /> 
 
    </p> 
 
    <p>Email: 
 
     <input type="text" name="player_email" /> 
 
    </p> 
 
     <p>Mobile: 
 
     <input type="text" name="mobile" /> 
 
    </p> 
 
\t </form> 
 
    <p> Refer: 
 

 
<div id="selected_form_code"> 
 
<select id="select_btn"> 
 
<option value="0">--Select--</option> 
 
<option value="1">One</option> 
 
<option value="2">Two</option> 
 
<option value="3">Three</option> 
 
<option value="4">Four</option> 
 
<option value="5">Five</option> 
 
</select> 
 
</div> 
 

 
\t <div id="form1"> \t 
 
\t \t <form id="form_submit" action="#" method="post"> 
 
\t \t <!-- dynamic Registration Form Fields Creates here--> 
 
\t \t </form> 
 
\t </div> 
 
<!------ right side advertisement div -----------------> 
 

 
\t 
 
</div>

Wie hängen die beiden Formulardaten zurück? Wenn Sie versuchen, den Wert zu drucken, wird der Formulardatenwert im Array angezeigt, aber der Wert des ersten Formulars wurde nicht gedruckt. Wie alle Formularfeldwerte zurückgegeben werden.

Answer 1

Ich weiß nicht, ob es ist, was Sie brauchen:

$("form").submit(function(e){ 
    e.preventDefault(); 
    var bigdata = []; 
    $.each($("form"), function(k, v){ 
    bigdata.push($(this).serializeArray()); 

    }) 
    console.log(bigdata); 
}) 

Live DEMO JSFiddle

Answer 2

können Sie nicht. Sie können nicht einfach zwei Formulare auf einer einzelnen HTTP-Anfrage senden.

Was Sie tun müssen, ist auf Client-Seite können Sie die Daten aus zwei Formen kombinieren und sie als Single-Form-Daten übermitteln.

Folgen Sie dem Link, um Daten aus zwei separaten Formular zusammenzuführen und als eins zu senden.

Merge values from two forms on submit