Wie kann ich zwei Formulare gleichzeitig mit einer einzigen Schaltfläche senden?

Zwei Formulare mit einer einzigen Schaltfläche senden

Das Senden von zwei Formularen mit einer Schaltfläche mag wie eine einfache Aufgabe erscheinen, ist aber mit herkömmlichen Methoden nicht möglich Formularübermittlungsmethoden. Dies liegt daran, dass beim Absenden eines Formulars von der aktuellen Seite weg zu der im Formular angegebenen Aktion navigiert wird.

Die Lösung: Asynchrone Formularübermittlung

Um beide Formulare gleichzeitig einzureichen, Wir müssen den traditionellen Prozess der Formularübermittlung umgehen. Wir können dies erreichen, indem wir das erste Formular asynchron über JavaScript senden, sodass wir das zweite Formular senden können, ohne das erste zu beeinträchtigen.

Asynchrone Formularübermittlung mit JavaScript:

Die Der folgende JavaScript-Code zeigt, wie das erste Formular asynchron übermittelt wird:

var f = document.forms.updateDB;
var postData = [];
for (var i = 0; i < f.elements.length; i++) {
    postData.push(encodeURIComponent(f.elements[i].name) + "=" +
        encodeURIComponent(f.elements[i].value));
}
var xhr = new XMLHttpRequest();
xhr.open("POST", "mypage.php", true);
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhr.send(postData.join("&"));

Sobald das erste Formular asynchron übermittelt wird, können wir es tun Senden Sie sofort das zweite Formular mit der Standard-Formular-Submit()-Methode:

document.forms.payPal.submit();

Aktualisierte Lösung (2023):

Die aktualisierte Lösung nutzt fetch() und modern JavaScript-Syntax:

function submitBothForms() {
    const { updateDB, payPal } = document.forms;
    fetch(updateDB.action, {
        method: updateDB.method,
        headers: { "content-type": updateDB.enctype },
        body: new FormData(updateDB),
    });

    payPal.submit();
}

Diese aktualisierte Lösung bietet eine präzisere und leistungsfähigere Implementierung im Vergleich zur ursprünglichen Antwort.

Das obige ist der detaillierte Inhalt vonWie kann ich zwei Formulare gleichzeitig mit einer einzigen Schaltfläche senden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!