2013-07-09 16 views
5

Ich versuche, 2 Formulare zur gleichen Zeit mit Javascript zu übermitteln. Es scheint jedoch, als ob nur die 2. Einreichung geöffnet wird, und nicht die erste.Einreichen von 2 Formularen gleichzeitig mit JavaScript

Der Code ist ziemlich einfach:

<html> 
<body> 
<form id="report_0" method="POST" target="_blank" action="https://www.google.com"> 
    <input type="hidden" name="test1" value="1"> 
    <input type="submit" value="report_0"> 
</form> 
<form id="report_1" method="POST" target="_blank" action="https://www.google.com"> 
    <input type="hidden" name="test2" value="2"> 
    <input type="submit" value="report_1"> 
</form> 
<script> 
    document.getElementById("report_0").submit(); 
    document.getElementById("report_1").submit(); 
    </script> 
</body> 
</html> 

I kann nicht Verwendung Ajax oder gleichwertig, wie es die 'native' POST (wegen CORS Ausgaben)

Ich habe irgendwo sein muss lesen dass du nicht 2 Formulare gleichzeitig einreichen kannst, macht das für mich keinen Sinn. Ich habe versucht, das Ziel von "_blank" zu "form1" & "Form2", aber immer noch nichts zu ändern.

Ihre Unterstützung wird sehr geschätzt :)

EDIT

Hier ist, was ich wirklich:

for (....) { 
     var form = document.createElement("form"); 
     form.setAttribute("name", "report_"+i); 
     form.setAttribute("method", "POST"); 
     form.setAttribute("target", "_blank"); 
     form.setAttribute("action", action); 

     for (var key in parms) { 
      var field = document.createElement("input"); 
      field.setAttribute("type", "hidden"); 
      field.setAttribute("name", key); 
      field.setAttribute("value", parms[key]); 
      form.appendChild(field); 
     } 
     console.log(form); 
     document.body.appendChild(form); 
     form.submit(); 
     document.body.removeChild(form); 
} 
+3

Nur weil Sie zwei Formulare auf einmal einreichen möchten, bedeutet das nicht, dass Sie es tun können. Hinzufügen eines "Senden beide" Buttons, der beide Formulare "funktioniert" in Firefox und IE. – RobG

+1

RobG, was ist mit Chrome? – natiz

Antwort

1

Sie können es diese Weise nicht. Wenn ein Formular gesendet wird, wird die gesamte Seite "zerstört" und die Antwort des Formulars als neue Seite geladen.

JavaScript-Code läuft single-threaded, also im Grunde lösen Sie das Submit-Ereignis auf zwei Formularen gleichzeitig aus und nur wenn Ihre JS fertig ist, übernimmt der Browser erneut und versucht, die Task-Warteschlange auszuführen.

Also, wenn Sie beide Formulare einreichen möchten „normal“ in einem nicht-AJAX Art und Weise, dann würden Sie müssen:

  1. Speichern, um die Werte der zweiten Form auf dem Client irgendwie (Cookie, local , Sie nennen es)
  2. Übermitteln Sie das erste Formular, das eine Seite ergibt, die genau das gleiche aussieht nur, dass irgendwo im Inhalt einige Trigger für Ihren JS-Code zu sehen, dass das erste Formular bereits gesendet wurde.
  3. Stellen Sie die Werte in das zweite Formular wieder her (der Server kennt diese nicht, weil sie nicht gesendet wurden)
  4. Senden Sie das zweite Formular ein.
+0

Ich mache es tatsächlich auf eine andere Art und Weise. – natiz

+0

... siehe oben EDIT. Ich kann es nicht so machen, weil ich die Seite, auf der der POST ausgeführt wird, nicht kontrollieren kann. – natiz

0

Formular senden ist ein synchroner Aufruf an den Server (HttpRequest). Daher kann das zweite Formular nicht eingereicht werden. Sie erwarten, mehrere Formulare zu übermitteln, ohne asynchron voneinander abzuhängen. Also, API wie AJAX wird das Problem lösen, aber Sie suchen nicht danach.

Wenn Ihr Design Ihnen erlaubt, mehrere Frames/Iframes in Ihrer Seite zu behalten, behalten Sie diese Formulare in verschiedenen Frames/Iframes. Mit diesem Ansatz können Sie mehrere Formulare von der übergeordneten Seite senden.

Wenn Sie die Anforderung zum Einreichen mehrerer Formulare gleichzeitig und Ihre Einschränkungen erklären können, erhalten Sie möglicherweise eine bessere Antwort.

+0

Ich hoffe du meinst die 1. Form .. weil das das Verhalten ist. nur der zweite wird eingereicht (= letzter) – natiz

3

nicht die schönste Art und Weise, es zu tun, aber ich dachte, es wäre schön, es trotzdem zu teilen. Ich landete es zu lösen durch setTimeout mit:

var requestDelay = 2000; 
document.getElementById("form-a").submit(); 

setTimeout(function() { 
    document.getElementById("form-b").submit(); 
}, requestDelay); 

Auf diese Weise wartet, bis form A (wahrscheinlich, mit einer Schätzung von 2 Sekunden) vorgelegt worden ist, und legt dann form B. Sie müssen möglicherweise mit der requestDelay herumspielen, um Ihren Bedürfnissen zu entsprechen.

Verwandte Themen