Domov Výpisy Premenné Dialógové okná Tlačidlá .Podmienky a vetvenie Cyklus Funkcie Objekty Objekt Array Objekty tvorené užívateľom Objekt Date Objekt Math Formuláre Objekty formulárov Ďalšie objekty formulára Obrázky Obrázky-2 Stavový riadok Popis v stavovom riadku Animovaný text Hodiny Skladačka Linky | |
9.Formuláre
Pri vytváraní formulárov potrebujeme skontrolovať správnosť vyplnených častí, napr. adresu, identifikačné časti a pod. Pokiaľ je formulár nesprávne vyplnený, po odoslaní a skontrolovaní sa musí vrátiť naspäť, preto je výhodnejšie,
aby si takto vyplnený formulár skontroloval užívateľ ešte pred odoslaním.
Formuláre zostavujeme značkami <form action="URLadresa" enctype="typkódovania" method="get"/"post" name="menoformulára" onReset="JavascriptKód"
onSubmit="JavascriptKód">...</form>
Poznámka: Ak nemáme server, ktorý spracúva naše informácie, možno dať poslať formulár e-mailom pomocou action = "mailto:adresa@server.sk"
Všetky vkladané polia a tlačidlá formulára sú tvorené značkou <input name="menovkladanéhopoľa" type="typvkladanéhopoľa" value="hodnotapoľa" size="dĺžkapoľa"
maxlength="maxdĺžka">
Typy polí:
"text" - jednoriadkový text
"textarea" - viacriadkový text s posunovníkom
"checkbox" - zaškrtávajúce políčko
"radio" - prepínač
"reset" - tlačidlo, ktorým vymažeme formulár
"submit" - tlačidlo odosielania
Príklad:
Vytvorte formulár na vyplnenie mena, priezviska a e-mailovej adresy s tlačidlami RESET a SUBMIT, pričom pred odoslaním dajte skotrolovať vyplnenie pomocou funkcie kontrola().
|
<html>
<head>
<script language="Javascript">
function kontrola(f) {
var vysledok=true;
if (f.meno.value=="") {
alert("Chýba meno!")
vysledok=false
}
if (f.priezvisko.value=="") {
alert("Chýba priezvisko!")
vysledok=false
}
var adresa=f.adresa.value
var pozicia;
if (adresa != "")
pozicia=adresa.indexOf("@")
else pozicia=-1
if (pozicia<0) {
alert("Chyba adresy ")
vysledok=false
}
alert ("vysledok má hodnotu "+vysledok)
}
</script>
</head>
<body>
<p><b>Formulár</b></p>
<form name-"nacionalie" method="POST" action="mailto:adresa@server.sk"
onsubmit="kontrola(this)">
<p>Vaše meno:<input type="text" name="meno"
size="15"></p>
<p>Vaše priezvisko:<input type="text" name="priezvisko"
size="15"></p>
<p>E-mail:<input type="text" name="adresa"
size="20"></p>
<p><input type="submit" value="Odoslať" name="B1"><input
type="reset" value="Vymazať" name="B2"></p>
</form>
</body>
</html>
Jednoduchý formulár:
|
Najskôr vytvoríme formulár v časti <body>s názvom nacionálie s ovládačom onsubmit="kontrola(this)", ktorý spôsobí, že po snahe odoslať formulár (po stlačení tlačidla SUBMIT) sa
vyvolá funkcia kontrola(f).
Vytvoríme 3 textové polia s názvami meno, priezvisko a adresa
|
V časti <head> umiestnime jednoduchú funkciu na kontrolu, či bolo vložené meno, priezvisko a či bol v časti adresa vložený znak "@"
|
- premenná výsledok sleduje vyššie spomenuté skutočnosti, na začiatku jej bola priradená hodnota true - pravda
- ak je meno a priezvisko prázdny reťazec, je vrátená hodnota false - nepravda
- pre kontrolu, či sa v adrese nachádza znak @, použijeme indexOf("@"), ktorý vráti pozíciu prvýkrát vyskytujúceho sa znaku @ v adrese - toto sme priradili premennej pozicia Ak sa nenájde tento znak, resp. adresa nebola zadaná (tu je
premennej pozicia priradená hodnota -1), opäť priradíme premennej vysledok hodnotu false
|
späť pokračovanie |