Kas yra „FormData“ objektas „JavaScript“?

FormData objektai naudojami formai užfiksuoti pateikiant formą, nuskaitant ją kitu būdu. Norėdami pridėti laukų su metodais, galime sukurti naują arba naujausią FormData HTML formą arba sukurti objektą nenaudodami jokių formų. Duomenys teksto laukuose turi būti pateikti paspaudus mygtuką pateikti, o JavaScript turi juos identifikuoti ir pateikti tas kintamųjų reikšmes.

Šis užrašas parodys „FormData“ objektą „JavaScript“ naudojant paprasčiausius pavyzdžius.

Kas yra „FormData“ objektas „JavaScript“?

„FormData“ objektas yra populiarus būdas kurti duomenų rinkinį „JavaScript“, kurį galima siųsti į serverį naudojant „ XMLHttpRequest “ arba paimtas. Jis atlieka tas pačias funkcijas kaip ir HTML formos elementas. Jį galima palyginti su masyvų masyvu. Atskiras masyvas žymi kiekvieną elementą, kurį norime perduoti serveriui.

Sintaksė

Norėdami naudoti FormData objektą JavaScript, naudokite šią sintaksę:

konst formData = naujas FormData ( ) ;

1 pavyzdys: Sukurkite FormData objektą be HTML formos

Visų pirma, inicijuokite konstantą konkrečiu pavadinimu ir priskirkite tai konstantai tam tikrą reikšmę. Čia „ naujas FormData() “ naudojama kaip pastovi vertė:

Konst formData = naujas FormData ( ) ;

Tada pridėkite duomenis perduodami argumentus lauke „ pridėti () “ metodas

formData. pridėti ( 'Fname' , 'Pareigūnas' ) ;

formData. pridėti ( 'Lvardas' , 'Javed' ) ;

formData. pridėti ( 'amžius' , 25 ) ;

Po to naudokite „ console.log() “ metodas:

konsolė. žurnalas ( 'Formos informacija' ) ;

Naudoti ' dėl “ kilpa kartoti ir rodyti išvestį konsolėje naudojant „ console.log() “ metodas:

dėl ( tegul formData obj ) {

konsolė. žurnalas ( obj ) ;

}

2 pavyzdys: Sukurkite FormData objektą naudodami HTML formą

Norėdami pridėti FormData su HTML forma, pirmiausia sukurkite formą HTML naudodami ' “ elementą ir pridėkite toliau nurodytą atributą:

Norėdami pridėti įvesties lauką formoje, naudokite „ <įvestis> “ elementas.
Įvesties žymos viduje nurodykite „ tipo “ atributas elemento duomenų tipui apibrėžti. Yra kelios galimos šio atributo reikšmės, įskaitant „ tekstą “, „ numerį “, „ data “, „ Slaptažodis ', ir daug daugiau.
„ vietos rezervuaras “ naudojamas norint pridėti reikšmę, kuri bus rodoma įvesties lauke, o „name“ nurodo įvesties lauko pavadinimą.
“ paspaudus “ įvykis suaktyvinamas, kai vartotojas atlieka funkciją spustelėdamas pelę:

< formos id = 'forma' >

< įvesties tipas = 'tekstas' vardas = 'Fname' vietos rezervuaras = 'Įveskite savo vardą' > 

< įvesties tipas = 'tekstas' vardas = 'Lvardas' vietos rezervuaras = 'Įveskite savo pavardę' > 

< įvesties tipas = 'data' vardas = 'amžius' vietos rezervuaras = „Įvesk savo amžių“ > 

< įvesties tipas = 'mygtukas' vertė = 'Įeiti' paspaudus = 'duomenys ()' >

forma >

Tada pasiekite formą CSS ir nustatykite tarpą aplink formą:

. forma {

marža : 20 piks ;

kamšalas : 30 piks ;

}

Be to, naudokite scenarijaus žymą ir pridėkite šį kodą:

funkciniai duomenys ( ) {
buvo forma = dokumentas. getElementById ( 'forma' ) ;
constformData = newFormData ( forma ) ;
konsolė. žurnalas ( 'Formos duomenys' ) ;
dėl ( tegul obj offormData ) {
konsolė. žurnalas ( obj ) ;
}
}

Aukščiau pateiktame kodo fragmente:

Iškvieskite ' getElementById („forma“) “ būdas pasiekti formą naudojant formos ID.
Dabar išsaugokite pasiektą elementą naujoje konstantoje ' formData “.
Naudoti ' dėl “ kilpą iteracijai ir išspausdinkite elementus konsolėje.

Išvestis

Sužinojote apie FormData objekto kūrimą JavaScript.

Išvada

FormData objektas naudojamas kuriant duomenų rinkinį „JavaScript“, kurį galima siųsti į serverį. Norėdami sukurti Formdata objektą JavaScript, demonstruojami du būdai. Pirmasis yra naudojant paprastą „JavaScript“, o antrasis – kuriant formą HTML ir susiejant ją su „JavaScript“. Šiame įraše buvo rašoma apie „FormData“ objektus „JavaScript“.

Kas yra „FormData“ objektas „JavaScript“?