Čo je objekt FormData v JavaScripte?

Co Je Objekt Formdata V Javascripte



Objekty FormData sa používajú na zachytenie formulára pri odosielaní formulára jeho načítaním inou metódou. Aby sme mohli pridať polia s metódami, môžeme vytvoriť nový alebo najnovší formulár HTML FormData alebo vytvoriť objekt bez použitia akýchkoľvek formulárov. Údaje v textových poliach musia byť poskytnuté po kliknutí na tlačidlo Odoslať a JavaScript ich musí identifikovať a dodať tieto hodnoty premenných.

Tento zápis demonštruje objekt FormData v JavaScripte pomocou najjednoduchších príkladov.

Čo je objekt FormData v JavaScripte?

Objekt FormData je populárny prístup k vytváraniu zberu údajov v jazyku JavaScript, ktorý možno odoslať na server pomocou „ XMLHttpRequest “ alebo načítané. Vykonáva rovnaké funkcie ako prvok formulára HTML. Dá sa to porovnať s radom polí. Samostatné pole predstavuje každý prvok, ktorý chceme preniesť na server.







Syntax



Ak chcete použiť objekt FormData v jazyku JavaScript, použite nasledujúcu syntax:



konšt formData = Nový FormData ( ) ;

Príklad 1: Vytvorte objekt FormData bez formulára HTML

Najprv inicializujte konštantu s konkrétnym názvom a priraďte tejto konštante konkrétnu hodnotu. Tu je „ new FormData() “ sa používa ako konštantná hodnota:





Konšt formData = Nový FormData ( ) ;

Potom pridajte údaje odovzdaním argumentov v „ pripojiť ()

formData. priložiť ( 'Fname' , 'dôstojník' ) ;

formData. priložiť ( 'meno' , 'Javed' ) ;

formData. priložiť ( 'Vek' , 25 ) ;

Potom použite „ console.log() “ metóda:



konzoly. log ( 'Informácie z formulára' ) ;

Použi ' pre ” slučka na iteráciu a zobrazenie výstupu na konzole pomocou “ console.log() “ metóda:

pre ( nech obj of formData ) {

konzoly. log ( obj ) ;

}

Príklad 2: Vytvorenie objektu FormData pomocou formulára HTML

Ak chcete pridať FormData s formulárom HTML, najprv vytvorte formulár v HTML pomocou „

” a pridajte nasledujúci atribút uvedený nižšie:

  • Ak chcete pridať vstupné pole do formulára, použite „ ' element.
  • Vo vnútri vstupnej značky zadajte „ typu ” na definovanie dátového typu prvku. Pre tento atribút existuje viacero možných hodnôt vrátane „ text “, “ číslo “, “ dátum “, “ heslo ', a mnoho ďalších.
  • ' zástupný symbol “ sa používa na pridanie hodnoty, ktorá sa má zobraziť vo vstupnom poli, a „názov“ sa vzťahuje na názov vstupného poľa.
  • po kliknutí ” udalosť sa spustí, keď používateľ vykoná funkciu kliknutím myšou:
< ID formulára = 'forma' >

< typ vstupu = 'text' názov = 'Fname' zástupný symbol = 'Zadajte svoje krstné meno' < br < br >

< typ vstupu = 'text' názov = 'meno' zástupný symbol = 'Zadajte svoje priezvisko' < br < br >

< typ vstupu = 'dátum' názov = 'Vek' zástupný symbol = 'Zadajte svoj vek' < br < br >

< typ vstupu = 'tlačidlo' hodnotu = 'Enter' po kliknutí = 'data()' >

formulár >

Ďalej prejdite k formuláru v CSS a nastavte priestor okolo formulára:

. formulár {

marža : 20 pixelov ;

vypchávka : 30 pixelov ;

}

Okrem toho použite značku skriptu a pridajte nasledujúci kód:

funkčné údaje ( ) {
bola forma = dokument. getElementById ( 'forma' ) ;
constformData = newFormData ( formulár ) ;
konzoly. log ( 'Údaje formulára' ) ;
pre ( nech obj offormData ) {
konzoly. log ( obj ) ;
}
}

Vo vyššie uvedenom útržku kódu:

  • Vyvolajte „ getElementById(“formulár”) ” na prístup k formuláru pomocou ID formulára.
  • Teraz uložte prístupný prvok do novej konštanty „ formData “.
  • Použi ' pre ” slučku pre iteráciu a vytlačte prvky na konzole.

Výkon

Dozvedeli ste sa o vytvorení objektu FormData v JavaScripte.

Záver

Objekt FormData sa používa na vytvorenie kolekcie údajov v jazyku JavaScript, ktoré možno odoslať na server. Na vytvorenie objektu Formdata v JavaScripte sú demonštrované dve metódy. Prvým je použitie jednoduchého JavaScriptu a druhým je vytváranie formulárov v HTML a ich prepojenie s JavaScriptom. Tento príspevok uvádzal objekty FormData v JavaScripte.