Wie sende ich zwei HTML-Formulare gleichzeitig mit einer Schaltfläche?

So senden Sie zwei Formulare mit einer Schaltfläche

Im HTML-Dokument ist es möglich, mehrere Formulare mit unterschiedlichen Aktionen zu haben. Allerdings kann es für den Benutzer umständlich sein, beide einzeln einzureichen. In diesem Artikel wird eine Lösung für dieses Dilemma untersucht, indem JavaScript zum gleichzeitigen Senden beider Formulare verwendet wird.

Erstes Formular: Senden von Daten an die Datenbank

Das erste Formular, updateDB, ist für das Senden von Daten an a verantwortlich Datenbank mit PHP. Hier ist ein Beispiel-HTML-Code:

Zweites Formular: Weiterleitung zur PayPal-Zahlungsseite

Das zweite Formular, PayPal, leitet den Benutzer bei der Übermittlung zu einer Zahlungsseite weiter.

JavaScript verwenden, um beide Formulare einzureichen

Um beide Formulare gleichzeitig einzureichen, befolgen Sie diese Schritte Schritte:

1. Erstellen Sie eine JavaScript-Funktion, um das Submit-Ereignis zu verarbeiten.
2. Verwenden Sie in der Funktion XMLHttpRequest oder fetch(), um das updateDB-Formular asynchron zu senden.
3. Nachdem das updateDB-Formular erfolgreich übermittelt wurde, senden Sie das PayPal-Formular.

function submitBothForms() {
    // Submit updateDB form asynchronously via XMLHttpRequest
    var xhr = new XMLHttpRequest();
    xhr.open("POST", "mypage.php", true);
    xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    xhr.send(postData.join("&"));

    // Submit payPal form
    document.getElementById("payPal").submit();
}

Aktualisierter Code mit Fetch()

async function submitBothForms() {
    // Submit updateDB form asynchronously via fetch()
    const res = await fetch("mypage.php", {
        method: "POST",
        headers: { "content-type": "application/x-www-form-urlencoded" },
        body: new FormData(updateDB),
    });
    if (!res.ok) throw new Error("DB Update Failed!");

    // Submit payPal form
    payPal.submit();
}

Fazit

Durch die Nutzung von JavaScript ist es möglich, zwei Formulare mit einer einzigen Schaltfläche zu übermitteln. Dieser Ansatz bietet Benutzern ein nahtloses Erlebnis und vermeidet die Notwendigkeit mehrerer Übermittlungen. Denken Sie daran, die Fehlerbehandlung und Nachrichtenübermittlung an Ihre spezifischen Anforderungen anzupassen.

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