2014-01-17 5 views
7

In meinem HTML habe ich mehrere Formulare (Texteingaben, Optionsfelder, Kontrollkästchen und auswählen) und eine Taste. Ich möchte alle diese Formulare ausfüllen und Werte an meine PHP-Datei senden. Momentan versuche ich Werte aus der Texteingabe zu übermitteln und wähle, aber ich stecke an diesem Punkt fest.Javascript Senden Sie mehrere Formulare mit einer Taste

Ich habe eine js Datei einreichen:

submitForms = function(){ 
    document.getElementById("form1").submit(); 
    document.getElementById("form2").submit(); 
} 

Und meine Formen sind wie folgt aus: SELECT:

<form id ="form1" name="dists" action="solve.php" method="post"> 
     <select id="demo" name="sadzba" onchange="selectElement1(this.value)> 
       <option value="">-- vyberte oblasť --</option> 
     </select> 
    </form> 

Texteingabe Form + Taste:

<form id="form2" action="solve.php" method="post"> 
    <input type="text" name="spotVT" ><label>kWh za rok VT</label> 
    <div id="nt" style='display:none'><input type="text" name="spotNT" ><label>kWh za rok NT</label></div> 

    </form> 
<input id="sub" type="button" value="Ok" style="margin-left:15px;" onclick="submitForms()"/> 

Aber diese funktioniert nicht. Kannst du mir bitte helfen? Danke

+0

Wie würden Sie einreichen, zwei Dinge zu zwei verschiedenen Seiten? Es würde zwei Treffer auf den Server erfordern, aber es ist eine Seite. Es wird nicht passieren mit einfachen Formvorlagen. – epascarello

+0

Mögliches Duplikat von [Übermitteln Sie zwei Formulare mit einem Knopf] (http://stackoverflow.com/questions/7843355/submit-two-forms-with-one-button) – Liam

Antwort

2

Diese Frage bereits von mehreren gefragt wurde, sehen Sie bitte die folgenden zwei Links:

Submit two forms with one button

Submit multiple forms with one submit button

Im Grunde sieht es aus wie Sie diese asynchron gehen zu müssen, tun.

+0

Wie Sie sehen können habe ich diese erste Lösung aber bereits ausprobiert es funktioniert nicht. Ich bin ziemlich neu zu jquery, javascript und php so prettz jetzt für mich schwer. – user2886091

+0

Es tut mir leid, ich hätte klarer sein sollen. In beiden Fällen werden Sie viele Kommentare/Antworten sehen, in denen erläutert wird, wie das erste Senden wahrscheinlich abgebrochen wird. Aus einer Antwort "Eine Formularübertragung führt dazu, dass die Seite zur Aktion des Formulars navigiert. Sie können also nicht beide Formulare auf herkömmliche Weise übermitteln. Wenn Sie dies mit JavaScript versuchen, rufen Sie form_submit() auf jedem Formular auf nacheinander wird jede Anfrage mit Ausnahme der letzten Einreichung abgebrochen. Sie müssen also das erste Formular asynchron über JavaScript senden ". Ein anderer Vorschlag im ersten Post (unten in der Nähe) ist, nur einmal zu senden. – t1nr2y

1

Es wird einfacher sein, nur ein Formular einzureichen. Sie können Ihrem Select- und Input-Tag den gleichen Formularnamen geben, indem Sie form = "your-form-id" zuweisen.

1

Hier ist ein einfaches Beispiel für eine native JavaScript-Implementierung.

<!DOCTYPE html> 
<html> 
<head> 
    <title>Multiform - JAVASCRIPT</title> 
</head> 
<body> 

<fieldset> 
    <legend>Form 1</legend> 
    <form name="f1" id="f1" onsubmit="return validate(this)"> 
     <input type="text" name="username" placeholder="Username" /> 
    </form> 
</fieldset> 

<fieldset> 
    <legend>Form 2</legend> 
    <form name="f2" id="f2" onsubmit="return validate(this)"> 
     <input type="text" name="email" placeholder="Email" /> 
    </form> 
</fieldset> 

<fieldset> 
    <legend>Form 3</legend> 
    <form name="f3" id="f3" onsubmit="return validate(this)"> 
     <input type="text" name="password" placeholder="Password" /> 
    </form> 
</fieldset> 

<button onclick="submitAll();">SUBMIT ALL</button> 

<script> 
'use strict'; 

function validate(form){ 
    //forms processsing goes here... 
    console.log(form, form.name) 
    return false; 
} 

function submitAll(){ 
    for(var i=0, n=document.forms.length; i<n; i++){ 
     document.forms[i].onsubmit(); 
    } 

} 

</script> 

</body> 
</html> 
+0

Verwenden Sie '.submit();' not '.onsubmit();' –

0

Sie könnten dies versuchen. Wenn alle Formen der Einreichung ist gut für Ihre Seite

$('form').submit(); 

Funktion, die in der tatsächlichen Verwendung ist:

function trySubmitAllForms() { 
    if ($('.saveSpinner').is(':visible')) { 
     return; 
    } 
    if ($('form').valid()) { 
     $('.saveSpinner').show(); 
     $('form').submit(); 
    } else { 
     showValidationErrorMessages(); 
    } 
}