Metoda obrasca submit(). submit() - rukovatelj za slanje obrasca na poslužitelj Pošalji obrazac

Submit() - instalira rukovatelj za slanje obrasca na poslužitelj ili pokreće ovaj događaj.

Metoda ima tri upotrebe.

Pošalji (rukovatelj)

• eventData - objekt koji sadrži podatke koji se prosljeđuju rukovatelju. Mora biti u formatu (fIme1:vrijednost1, fIme2:vrijednost2, ...) ;
• rukovatelj - funkcija koja će biti postavljena kao rukovatelj.

Pokreće događaj podnošenja na odabranim elementima stranice.

U prva dva slučaja upotrebe metoda je analogna .on("submit", handler) , au trećem slučaju analogna .trigger("submit") .

Događaj podnošenja događa se neposredno prije slanja obrasca na poslužitelj, a u rukovatelju možete pokrenuti otkazivanje obrasca pozivanjem metode eventObject.preventDefault() ili jednostavnim vraćanjem false. Događaj slanja može se vezati samo za element obrasca.

Obrasci se mogu poslati ili pritiskom na izričito , , ili , ili pritiskom na Enter kada su određeni elementi obrasca u fokusu.

Na primjer, pogledajmo HTML:

Obrađivač događaja može se pridružiti obrascu:

$("#target").submit(function(event) ( alert("Pozvan je rukovatelj za .submit()."); event.preventDefault(); ));

Sada, kada se obrazac pošalje, prikazat će se poruka. Ovaj se događaj događa prije stvarnog slanja, tako da ovu radnju možemo poništiti pozivanjem .preventDefault() na objektu događaja ili vraćanjem false iz našeg rukovatelja. Događaj možemo pokrenuti ručno kada se klikne na drugi element:

$("#other").click(function() ( $("#target").submit(); ));

Nakon izvršavanja ovog koda, također će se izdati poruka, ali će se pokrenuti zadana radnja slanja na obrascu, tako da će obrazac biti predan.

JavaScript događaj slanja ne pojavljuje se u obliku mjehurića Internet Explorer. Međutim, skripte koje se oslanjaju na delegiranje događaja s događajem otpreme dosljedno će raditi različitim preglednicima od jQuery 1.4, koji je normalizirao ponašanje događaja.

Događaj submit() samo je skraćenica za .on("submit", handler) , tako da možete ukloniti instalirani rukovatelj pomoću .off("submit")

Obrasci i njihovi dječji elementi ne bi trebao koristiti nazive unosa ili identifikatore koji su u sukobu sa svojstvima obrasca kao što su slanje, duljina ili metoda. Sukobi imena mogu uzrokovati padove.

Instalira rukovatelj slanjem obrasca na poslužitelj ili pokreće ovaj događaj. Metoda ima tri slučaja upotrebe:

handler(eventObject) - funkcija koja će biti postavljena kao rukovatelj. Kada se pozove, primit će objekt događaja eventObject .

handler(eventObject) - vidi gore.
eventData - dodatni podaci proslijeđeni rukovatelju. Moraju biti predstavljeni objektom u formatu: (fName1:vrijednost1, fName2:vrijednost2, ...) .

Možete ukloniti instalirani rukovatelj pomoću metode unbind().

Sve tri opcije za korištenje metode analogne su drugim metodama (vidi gore), tako da se svi detalji korištenja submit() mogu pronaći u opisu ovih metoda.

Događaj podnošenja događa se neposredno prije slanja obrasca na poslužitelj, a u rukovatelju možete pokrenuti otkazivanje obrasca pozivanjem metode eventObject.preventDefault() ili jednostavnim vraćanjem false.

U IE-u, događaj podnošenja, za razliku od drugih događaja, nema svojstvo "povećanja hijerarhije". Međutim, počevši od jQuery-1.4, ovaj nedostatak je eliminiran i rukovatelji događajima slanja instalirani na elementima koji se nalaze iznad elementa obrasca u hijerarhiji bit će obaviješteni o nadolazećem slanju podataka na poslužitelj.

// instalirajte rukovatelj događajima podnošenja za element s identifikatorom foo, // zatim onemogućite slanje podataka na poslužitelj $("#foo" ) .submit (funkcija () ( upozorenje ("Obrazac foo poslan je na poslužitelj." vrati netočno;)); // pozivamo događaj podnošenja na elementu foo $("#foo" ) .submit () ; // instalirajte još jedan rukovatelj događajem slanja, ovaj put za elemente // s klasom bloka. Proslijedimo dodatne podatke rukovatelju $(".block" ) .submit (( a: 12 , b: "abc" ) , function (eventObject) ( var externalData = "a=" + eventObject.data .a + ", b= " + eventObject.data .b ; upozorenje ("Obrazac foo je poslan na poslužitelj." + "Podaci proslijeđeni obrađivaču ovog događaja: " + externalData ) ; ) ) ;

Pozivanje metode slanja() obrasca nije isto što i klik na gumb za slanje. Kada se ova metoda pozove, izvršit će se samo treća od gornje tri radnje - slanje podataka na poslužitelj. Da ne bi trebao generirati poziv rukovatelja na klik tipke za slanje, sasvim razumljivo - na kraju krajeva, pokušavamo poslati podatke zaobilazeći tipku za slanje (koja, usput rečeno, možda uopće ne postoji). Ali onSubmit obrasca za obradu događaja također se ne poziva - to je za mnoge neočekivano. Nećemo suditi koliko je to logično (i zašto se ovo ponašanje razlikuje od ponašanja metode resetirati(), pogledajte dolje), ali jednostavno ilustrirajte ovaj učinak uvođenjem u prethodni primjer veze koja poziva metodu podnijeti():

Pozovite submit() metodu obrasca

5.8. Metoda submit() ne poziva rukovatelja onSubmit

Dakle, podaci mogu ići na poslužitelj bez da ih prethodno provjeri JavaScript skripta. Kako možete natjerati preglednik da pozove rukovatelja onSubmit? Da biste to učinili, moguće je izravno pristupiti ovom rukovatelju: document.f.onsubmit(). Ostaje za pretpostaviti da nakon ove metode podnijeti() ne treba uvijek pozivati, već samo ako onSubmit nije vratio nikakvu vrijednost ili je vratio true, drugim riječima, ako nije vratio false. Na kraju dobivamo:

Pozovite submit() s onSubmit pretprovjerom

5.9. Prisilni poziv onSubmit prije submit()

Postoji još jedan način iniciranja slanje podataka obrascima, zaobilazeći gumb za slanje (koji, usput rečeno, obrazac možda nema). Ako je fokus na bilo kojem tekstualnom polju obrasca i korisnik pritisne Enter, tada će (u većini preglednika) biti pozvan rukovatelj događajem obrasca onSubmit i slanje podataka na poslužitelj.

Unesite tekst i pritisnite Enter:

5.10. Slanje podataka obrasca pritiskom na Enter

Ova metoda djeluje logičnije od metode podnijeti(), jer Podaci koji se šalju na poslužitelj ne izbjegavaju preliminarnu provjeru od strane rukovatelja onSubmit.

gumb za resetiranje

Gumb za resetiranje ( resetirati) omogućuje vraćanje svih polja obrasca u izvorno stanje u kojem su bila kada se stranica učitala. Klikom na gumb za resetiranje dolazi do sljedećeg niza radnji preglednika:

1. pozivanje rukovatelja događajima na klik na ovom gumbu;

2. pozivanje onReset obrađivača događaja forme;

3. Vratite zadane vrijednosti u svim poljima obrasca.

Pozivanje klik metode() na gumbu za resetiranje jednako je pritisku ovog gumba, tj. dovodi do iste tri akcije:

Pozovite click() metodu gumba za resetiranje

5.11. Pozivanje metode click() na gumbu za resetiranje

Postoje načini za resetiranje obrasca početno stanje zaobilazeći gumb za resetiranje (koji, usput rečeno, obrazac možda nema). Prvo, ovo metoda resetiranja poziva() na obrascu. Drugo, ako je fokus na bilo kojem polju ili gumbu na obrascu, možete pritisnuti tipku Esc. Primjer:

Promijenite tekst i zatim pritisnite Esc (ili vezu).
Pozovite metodu obrasca reset().

5.12. Resetirajte obrazac klikom Tipke Esc

Kao što vidite, obje metode ne samo da poništavaju obrazac, već također pozivaju obrasca onReset rukovatelja događajima. Dakle, metoda resetirati() ponaša se logičnije i predvidljiv, rađe nego podnijeti().

Grafički gumb

Grafički gumb vrsta je gumba za slanje. Njegova razlika je u tome što će umjesto gumba s natpisom korisnik vidjeti sliku na koju se može kliknuti:

Osim toga, kada korisnik klikovi kliknite na grafički gumb, tada će poslužitelju biti poslani ne samo podaci uneseni u polja obrasca, već i koordinate pokazivača miša u odnosu na gornji lijevi kut slike. Nažalost, nije moguće presresti ove koordinate u JavaScript programu. Ako trebate raditi s ovim koordinatama, preporučuje se stvaranje umjesto grafičkog gumba aktivna kartica pomoću posude.

Grafički gumbi imaju brojne neobičnosti. Na primjer, budući da su i gumb i slika, iz nekog razloga nedostaju kao u zbirci document.f. elementi, iu zbirci document.images (IE 7, Mozilla Firefox). Zbog toga se ne ubrajaju u ukupan broj elemenata obrasca (document.f. duljina), niti u ukupnom broju slika u dokumentu (document.images. duljina).

Kako pristupiti takvom gumbu? To se može učiniti, na primjer, postavljanjem ID atributa:

a zatim u programu napisom: var knopka = dokument. getElementById("d1"). Nakon toga možemo pristupiti svojstvima ovog gumba, npr. knopka.src, kao i metodi knopka. klik(). Sljedeći primjer to pokazuje pozivanje metode klika() grafičkog gumba je "gotovo" ekvivalentno pritisku ovog gumba, tj. sekvencijalno poziva rukovatelje pozivima na klik gumbe, onSubmit obrasca i prenosi podatke na poslužitelj (ali što se prenosi kao koordinate kursora miša?):

5.13. Pozivanje click() metode na grafičkom gumbu

Budući da se grafički gumbi koriste prilično rijetko, ovdje ćemo prestati raspravljati o njima.

Određena funkcija rukovatelja je "vezana" na "onSubmit" obrasca pomoću standardne funkcije addHandler/addEvent (korisne funkcije).
Dakle, ako se obrazac pošalje klikom na unos, poziva se funkcija rukovatelja,
ako putem form.submit(), onda ne.
I zašto? Kako to mogu popraviti?

Vozite se cestom, a onda odjednom bum, "crveno svjetlo" (onSubmit), ali događaj! Pa, obradiš to prirodno - pritisneš kočnicu (form.submit()), voziš dalje, a onda ups, Bobby iskoči, opet pritisneš kočnicu, ali iz nekog razloga crveno svjetlo se ne pojavljuje. I zašto?
Kako to popraviti - razmislite o tome kako preglednik radi, radi kako treba, a ne kako vi želite. onSubmit je događaj, form.submit() je samo njegov rukovatelj niske razine, koristi ga sam preglednik, a dostupan je programeru po potrebi. Zašto bi on inicirao ovaj događaj? Dakle, nije daleko od zakačenja. Jedno je akciju zamisliti, a drugo je provesti. Ideja/misao/događaj i metoda rukovatelja/pedale/instrumenta dvije su različite stvari. Nema potrebe dodavati rukovatelj metodi, to je besmislica. U najjednostavnijem slučaju, pozovite funkciju rukovatelja prije poziva form.submit().

I na hrpu... Značajka je dokumentirana. MSDN:

FORM.submit()
Metoda podnošenja ne poziva rukovatelja događajem onsubmit. Izravno pozovite rukovatelja događajima onsubmit. Prilikom korištenja Microsoft Internet Explorer 5.5 i novije, možete pozvati metodu fireEvent s vrijednošću onsubmit u parametru sEvent.

Kada korisnik pritisne unos nešto poput

If (form.onSubmit()) form.submit();

Izvući zaključak.
Ako form.submit() poziva form.onSubmit(), tada će to biti rekurzija.
Da biste to popravili, trebate upotrijebiti proširenu verziju "standardne funkcije addHandler/addEvent", koja vam omogućuje pokretanje događaja. U IE, naravno, možete i bez ovoga - pogledajte fireEvent. U FF također možete napraviti nešto slično ali puno kompliciranije.

Dvornov Roman[dosje], univerzalnije - ovako:
if (form.onsubmit() != false) form.submit();
Jer, prvo, JavaScript je osjetljiv na velika i mala slova (ne možete pisati form.onSubmit), i drugo, slanje podataka na poslužitelj trebalo bi se dogoditi ne samo kada onsubmit() vrati true, već i kada ne vrati ništa (na primjer, ako onsubmit rukovatelj sadrži samo upozorenje ili korisnik uopće nije odredio nikakve radnje u ovom rukovatelju).

Thirteensmay[dossier], naravno, usporedba s crvenim svjetlom, pedalom i bobbyjem je prekrasna! :) Ali, nažalost, ne objašnjava ovaj fenomen. Zato što bi trebao biti jednako primjenjiv na sve rukovatelje i metode, što se, međutim, ne poštuje. Dopustite mi da preciznije formuliram preostalo otvoreno pitanje:

Metoda click() na hipervezi uključuje pozivanje rukovatelja onClick za tu vezu
- metoda click() za BILO KOJI gumb obrasca - uključuje pozivanje rukovatelja onClick ovog gumba
- reset() metoda za formu - uključuje pozivanje onReset rukovatelja za formu
- ALI metoda obrasca submit() NE podrazumijeva pozivanje onSubmit rukovatelja obrasca!

Kakvo bi moglo postojati (za programere jezika ili preglednike?) da se to učini tako drugačije?

S pojavom HTML5, obrasci su postali svestraniji. Ulazni element sada može sadržavati email adrese, datumi i više, mogu se označiti kao potrebni bez korištenja javascripta - a ovo su samo neke od najvrjednijih značajki. Također, sada možete koristiti nekoliko gumba za slanje za jedan obrazac, a sada je moguće premjestiti gumb za slanje izvan obrasca.

Donedavno ste u obrazac mogli umetnuti samo jedan gumb za slanje, inače bi obrazac obrađivao samo zadnji gumb. Dodavanjem method="post" i url-a elementu forme "form" dobili smo radnu formu.

Sada se situacija promijenila - u HTML su dodana nova svojstva "formmethod" i "formaction". Omogućuju vam da dodate metodu objave i url izravno na gumb "pošalji", tako da ne morate ništa dodavati u obrazac. Dodavanje ovih parametara gumbu "pošalji", a ne obrascu, daje veću fleksibilnost obrascu. Sada možete napraviti onoliko gumba koliko je potrebno za obrazac.

Sada svaki gumb "pošalji" pripada drugom URL-u, a sve to eliminira potrebu za pisanjem javascript koda tijekom izgleda. Sve ovo radi odlično i sada kada kliknete na gumb, obrazac će dobiti formmethod i formation, koji će prebrisati standardni parametri način i djelovanje. Ako obrazac sadrži uobičajeni gumb "pošalji" bez novih parametara, vratit će vrijednosti obrasca postavljene za element obrasca.

Formmethod i formation svojstva podržavaju svi popularni preglednici

Opće je prihvaćena činjenica da svi elementi forme koji joj pripadaju moraju biti unutar elementa. To smanjuje fleksibilnost u dizajnu samih obrazaca. Zahvaljujući novom atributu "forma", sada se bilo koji element može premjestiti izvan obrasca i bilo koji element obrasca može se postaviti u bilo koji dio stranice. Da biste to učinili, trebate samo dodati ID u obrazac, a zatim dodati vrijednost tog ID-a svim elementima kao atribut.

Danas atribut forme podržavaju svi popularni preglednici, osim Internet Explorera (do verzije 10).