Hva er et formdata -objekt i JavaScript?

FormData -objekter brukes til å fange skjemaet når du sender inn et skjema ved å hente det med en annen metode. For å legge til felt med metoder, kan vi enten konstruere en ny eller siste formdata HTML -form eller lage et objekt uten å bruke noen skjemaer. Dataene i tekstfeltene må være gitt når sendeknappen er klikket, og JavaScript må identifisere dem og levere disse variable verdiene.

Denne oppskrivningen vil demonstrere FormData-objektet i JavaScript ved hjelp av de enkleste eksemplene.

Hva er et formdata -objekt i JavaScript?

Et FormData -objekt er en populær tilnærming til å bygge en datainnsamling i JavaScript som kan sendes til serveren ved å bruke “XmlhttpRequest”Eller hentet. Den utfører de samme funksjonene som HTML -skjemaelementet. Det kan sammenlignes med en rekke matriser. En egen matrise representerer hvert element vi ønsker å overføre til serveren.

Syntaks

For å bruke FormData -objektet i JavaScript, bruk følgende syntaks:

const formData = new FormData ();

Eksempel 1: Lag FormData -objekt uten HTML -form

Først av alt, initialiser en konstant med et spesifikt navn og tilordne en bestemt verdi til den konstanten. Her, "Ny FormData ()”Brukes som en konstant verdi:

Const formData = new FormData ();

Deretter legger du til dataene ved å formidle argumentene i “vedlegg ()”Metode

formdata.vedlegg ('fname', 'hafsa');
formdata.vedlegg ('lname', 'Javed');
formdata.vedlegg ('alder', 25);

Etter det, bruk "konsoll.Logg()”Metode:

konsoll.Logg ("Forminformasjon");

Bruke "til”Loop for å iterere og vise utgangen på konsollen ved hjelp av“konsoll.Logg()”Metode:

for (la obj av formdata)
konsoll.logg (OBJ);

Eksempel 2: Lag FormData -objekt med en HTML -form

For å legge til formdata med en HTML -form, først, oppretter en form i HTML ved hjelp av "”Element og legg til følgende attributt oppført nedenfor:

• For å legge til inngangsfeltet i skjemaet, bruk "”Element.
• Inne i inngangskoden, spesifiser "type”Attributt for å definere elementets datatype. Det er flere mulige verdier for denne attributtet, inkludert "tekst”,“Antall”,“Dato”,“passord", og mange flere.
• “stedholder”Brukes til å legge til verdien som skal vises på inngangsfeltet, og“ Navn ”refererer til navnet på inngangsfeltet.
• “ved trykk”Arrangementet blir utløst når brukeren utfører en funksjonalitet ved å klikke på musen:

Deretter får du tilgang til skjemaet i CSS og sett plassen rundt skjemaet:

.form
Margin: 20px;
polstring: 30px;

Bruk dessuten skriptetoden og legg til følgende kode:

FunctionData ()
var form = dokument.getElementById ("form");
constformData = newFormData (skjema);
konsoll.logg ("skjema data");
for (la obj offormdata)
konsoll.logg (OBJ);

I ovennevnte kodebit:

• Påkalle “getElementById (“Form”)”Metode for å få tilgang til skjemaet ved å bruke skjema -ID.
• Oppbevar nå det tilgjengelige elementet i en ny konstant "formdata”.
• Bruke "til”Loop for iterasjon og skriv ut elementene på konsollen.

Produksjon

Du har lært om opprettelsen av FormData -objektet i JavaScript.

Konklusjon

Et FormData -objekt brukes til å bygge en samling av data i JavaScript som kan sendes til serveren. For å lage formdata -objektet i JavaScript, blir to metoder demonstrert. Den første bruker enkel JavaScript, og den andre er gjennom formskaping i HTML og kobler den til JavaScript. Dette innlegget uttalte om FormData -objekter i JavaScript.