Ankündigung

Einklappen
Keine Ankündigung bisher.

Post request mit fetch api mit 3 Form Elementen

Einklappen

Neue Werbung 2019

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • Post request mit fetch api mit 3 Form Elementen

    Nabend,

    ich habe eine Datei mit 3 verschiedenen Form Elementen ( 1 für Stammdaten, 1 für Bankdaten und eine für Lieferadressen).

    Nach erfolgter Eingabe möchte ich sämtliche Daten der 3 Form Elemente in einem Rutsch per Fech Api an meine verarbeitende Php Datei schicken.

    Ich denke mal, im body meines Fetch requests kann ich nur eine Ressource angeben, so dass ich die Daten der 3 Formelemente zusammenführen muss oder ?

    Ist das wie nachfolgt der richtige Ansatz ? :
    Code:
    const form1 = document.querySelector('#form1');
    const form2 = document.querySelector('#form2');
    const form3 = document.querySelector('#form3');
    
    
     let data1 = new FormData(form1);  
     let data2 = new FormData(form2);  
     let data3 = new FormData(form3);  
         
         
     for (let [key, value] of data2) {  
           data1.append(key, value);  
     }  
         
     for (let [key, value] of data3) {  
           data1.append(key, value);  
     }  
         
     const postData = async() => {  
           const response = await fetch(„meinedatei.php“, {  
                 method: „POST“,  
                 headers : {  
                   „Content-Type“: „application/json“  
                 },  
                 body: data1  
            });  
            const jsonResponse = await response.json();  
            alert(jsonResponse);  
     }

  • #2
    Warum nicht 1 Formular mit mehreren Fieldsets? Aber ja, wenn du alles in einem Rutsch schicken möchtest, und 3 Formualre hast, musst du diese zusammenfassen für das Abschicken.

    Kommentar


    • #3
      Moin Zeichen,

      ich habe in meinem html Code ein Menü vorgesehen, welches permanent oberhalb des Fensters fixiert bleibt, wo ich Icons habe zum anlegen, editieren, löschen etc.

      Ausserdem habe ich für die 3 Formulare jeweils einen eigenen tab, der dann jeweils den html Inhalt per Klick anzeigt.

      => <div id="Stammdaten" class="tabcontent">

      Wenn ich dann z.B. auf editieren drücke, dann frier ich die jeweils beiden nicht aktiven Tabs ein und nach dem speichern möchte ich somit
      nur die Daten des jeweiligen aktiven Tab in der Datenbank abändern.

      Jetzt weiss ich jedenfalls, dass mein Ansatz der richtige ist, falls ich mal alles in einem Rutsch abschicken möchte (z.B beim neu anlegen) , danke.

      Kommentar

      Lädt...
      X