Form objektum

A form objektum bemutatása :

A form objektum által, mely a JavaScript objektum hierarhiában a document objektum alatt található, lehetőségünk van az űrlap megjelenésének befolyásolására, elérésére. Ezt többféle módon is megtehetjük :

Példa 1:

document.forms[#].tulajdonság
document.forms[#].metódus()

cél = document.forms[0].action;
document.forms[0].reset();

Példa 2:

document.forms["űrlapneve"].tulajdonság
document.forms["űrlapneve"].metódus

cél = document.forms["űrlap"].action;
document.forms["űrlap"].reset();

Példa 3:

document.űrlapneve.tulajdonság
document.űrlapneve.metódus()

cél = document.űrlap.action;
document.űrlap.reset();

Magyarázat:

Az űrlapokat háromféle módon szólíthatjuk meg :

sorszámmal, ahol a számozás 0-val kezd / Példa 1
névvel, ahogy az a name= után lett megadva / Példa 2
közvetlenül az űrlap nevével a document szó után írva / Példa 3

action

Meghatározza az action= tulajdonság értékét, mely például a címzett nevét vagy a szerveren futó programm nevét tartalmazza, mely az űrlap adatait feldolgozza..

Példa:

<html><head><title>Teszt</title>
<script language="JavaScript">
function Visszajelez() {
 x = window.confirm("Címzett :  " + document.urlap.action);
 return x;
}
</script>
</head><body>
<form name="urlap" action="mailto:sajat@magam.hu" 
onSubmit="return Visszajelez()">
<input type=text size=40 name="Bevitel">
<input type=submit value="Elküld">
</form></body></html>

Magyarázat:

A példa egy űrlapot mutat. Ha a felhasználó ráklikkel az Elküld gombra, akkor az maghívja a Visszajelez() függvényt mely a confirm metódus hívásával megerősítést is kér, melynek értékét az x változóban tároljuk el. Ez lesz a függvény visszatérő értéke. Erre az igaz/ hamis ítéletre az onSubmit eseménykezelőnek van szüksége. Ha ez true, akkor az űrlap el lesz küldve, különben nem.

encoding

Tárolja azt az értéket, melyet az űrlap létrehozásakor az encoding= (kódolás tipusa) elemváltozó tartalmaz.

Példa:

<html><head><title>Teszt</title>
<script language="JavaScript">
function vizsgal() {
 if(document.urlap.action.indexOf("@") > 0)
  document.urlap.encoding = "text/plain";
 else
  document.urlap.encoding = "x-application/x-www-form-urlencoded";
 return true;
}
</script>
</head><body>
<form name="urlap" action="mailto:sajat@magam.hu" 
onSubmit="return vizsgal()">
<input type=text size=40 name="Bevitel">
<input type=submit value="Elküld">
</form></body></html>

Magyarázat:

A példa egy űrlapot mutat. Ha a felhasználó ráklikkel az Elküld gombra, akkor az maghívja a vizsgal()függvényt. Ebben megvizsgáljuk, hogy a megadott E-Mail cím tartalmaz-e @ jelet. Ha tartalmaz, akkor a kódolás tipusa megadás a text/plain,kőlönben a CGI programozásban megszokott:x-application/x-www-form-urlencoded, A függvény visszatérő értéke true. Ilyen Boolean értéket vár a függvényt meghívó onSubmit eseménykezelő, mely a bevezető <form> Tag-ban található . Az űrlap akkor lesz elküldve, ha ez a visszatérő érték true. A példában látható: indexOf() metódus leírása a string objektumnál található..

length

Megadja az űrlapok számát, mely a HTML fájlban definiálva volt.

Példa:

<html><head><title>Teszt</title>
</head><body>
<form name="urlap1" action="mailto:sajat@magam.hu">
<input type=hidden value="jancsi">
<input type=submit value="János Vitéz">
</form>
<form name="urlap2" action="mailto:sajat@magam.hu">
<input type=hidden value="sanyi">
<input type=submit value="Petőfi Sándor">
</form>
<script language="JavaScript">
 document.write(document.forms.length + " űrlap van definiálva ");
</script></body></html>

Magyarázat:

Olyan példát látunk, melyben a létrehozott űrlapok számát document write() metódus segítségével jelenítjük meg.

method

Tárolja azt az értéket, melyet az űrlap létrehozásakor a method= elemváltozó tartalmaz.Ez pedig arra utal, hogy az adatok hogyan jutnak el a CGI Scripthez. Ha ez az érték GET akkor, akkor az adatok az URL után csapódnak egy kérdőjellel. Ha POST akkor a CGI Scriptek a standard inputon keresztül kapják meg az űrlap adatait.

Példa:

<html><head><title>Teszt</title>
<script language="JavaScript">
function vizsgal() {
 if(document.urlap.action.indexOf("@") > 0)
  document.urlap.method = "post";
 else
  document.urlap.method = "get";
  return true;
}
</script>
</head><body>
<form name="urlap" action="mailto:sajat@magam.hu" 
onSubmit="return vizsgal()">
<input type=text size=40 name="Bevitel">
<input type=submit value="Elküld">
</form></body></html>

Magyarázat:

A példa egy űrlapot mutat. Ha a felhasználó ráklikkel az Elküld gombra, akkor az maghívja a vizsgal() függvényt. Ebben megvizsgáljuk, hogy az action elemváltozóban található e@ jel. Ha igen akkor az elküldés módja post, különben get. A függvény visszatérő értéke true. Ilyen Boolean értéket vár a függvényt meghívó onSubmit eseménykezelő, mely a bevezető <form> Tag-ban található . Az űrlap akkor lesz elküldve, ha a visszatérő érték true. A példában látható: indexOf() metódus leírása a stringobjektumnál található..

name

Megadja az űrlap nevét. A document forms tömbben ezzel a névvel lehet rá hivatkozni.

Példa:

<html><head><title>Teszt</title>
</head><body>
<form name="urlap" action="mailto:sajat@magam.hu">
<input type=text size=40 name="Bevitel">
<input type=submit value="Elküld">
</form>
<script language="JavaScript">
 document.urlap.bevitel.value = document.urlap.name;
</script></body></html>

target= "ablaknév"

Megadja, hogy az elküldés után melyik ablak legyen aktív. Ha a CGI programm egy olyan HTML fájlnak üzen vissza, mely egy frame set-ben van betöltve, akkor az üzenet a target="ablaknév" névvel megadott ablakban jelenik meg.

Példa:

<html><head><title>Teszt</title>
<script language="JavaScript">
function valaszt(){
 document.urlap.target = "also";
 return true;
}
</script>
</head><body>
<form name="urlap" action="/cgi-bin/urlap.pl" 
onSubmit="return valaszt()">
<input type=text size=40 name="Bevitel">
<input type=submit value="Elküld">
</form></body></html>

Magyarázat:

A példában feltételezzük, hogy egy olyan űrlap adatát szeretnénk elküldeni, mely az alsó keretbe volt betöltve.Az Elküld gomb megnyomásával, a valaszt() függvényt adja meg az ablak nevét. Igy a CGI programm urlap.pl eredménye az alsó ablakban jelenik meg.

handleEvent()

Továbbadja a vezérlést egy olyan objektumnak, mely képes arra reagálni.Ugyanúgy működik mint a Window objektum handleEvent() metódusa.

reset()

Az űrlap teljes tartalmát törli, hatása ugyanaz, mint az ablakban definiált Törlés gombnak.Így a téves adatbevitelt lehet korrigálni. Figyelem : Az onReset eseménykezelőt nem hívja meg.

Példa:

<html><head><title>Teszt</title>
</head><body>
<form name="urlap">
<input type=text size=40 name="mezo1"><br>
<input type=text size=40 name="mezo2"><br>
</form>
<a href="javascript:document.urlap.reset()">Űrlap törlése</a>
</body></html>

submit()

Az elküldi az űrlap teljes tartalmát, hatása ugyanaz, mint az ablakban definiált Elküld gombnak. Figyelem : Az onSubmit Az onReset eseménykezelőt nem hívja meg.

Példa:

<html><head><title>Teszt</title>
</head><body>
<form name="urlap action="/cgi-bin/eredmeny.pl" method=get>
<input type=text size=30 name="mezo1"><br>
<input type=text size=40 name="mezo2"><br>
</form>
<script language="JavaScript">
 function Elkuld() {
  document.urlap.submit();
 }
 window.setTimeout("Elkuld()",60000);
</script></body></html>

Magyarázat:

A példa egy űrlapot mutat beviteli mezőkkel. Alatta egy JavaScript területet definiáltunk, melyben visszaszámlálás folyik. Egy perc leteltével az Elkuld() függvényt hívjuk meg, mely elküldi az űrlap adatait a szerver felé a CGI Script számára.

Form objektum
A form objektum használata
Elemváltozók (tulajdonságok) :
action		A fogadóldali cím az elküldéskor
encoding		A kódolás tipusa
length		Az űrlapok száma
method		Az adatok elküldésének módja
name		Az űrlap neve
target		Válaszablak neve a CGI számára
Elemfüggvények (metódusok) :
handleEvent()		Eseménykezelés
reset()		Űrlap adatok törlése
submit()		Űrlap adatok elküldése
Alárendelt objektumok :
elements		Egy űrlap elemei