JavaScript - Formuláře
JavaScript umí pracovat s formuláři. Pomocí JavaScriptu je možné ověřovat vyplněná data, rozhodovat o odeslání formuláře atd.
Prvky formuláře
Na prvek formuláře (input, textarea atd.) je možné se odkazovat pomocí jejich pořadí v rámci formuláře (form), nebo efektivněji pomocí jejich jmen (atribut name):
<form name="form"> <input type="text" name="form2"> <input type="text" name="form3"> <a href="javascript:form();">OK</a> </form> <script> function form(){ if(document.form.form2.value=="") window.alert("nevyplnil jste první pole!"); else if(document.form.form3.value=="") window.alert("nevyplnil jste druhé pole!"); else if(document.form.form3.value=="" && document.form.form2.value=="") window.alert("nic jste nevyplnil!"); else window.alert("1.pole obsahuje: "+document.form.form2.value+" a 2.pole obsahuje: "+document.forms[0].elements[1].value); } </script>
Vytvořili jsme jednoduchý formulář, který ověřuje, zda jsou vyplněné obě položky (pokud ne, oznámí to dialogovým oknem), pokud jsou vyplněné, vypíše je prostřednictvím dialogového okna. První vlastnost, kterou k formulářovému prvku přistupujeme, je document.forms[pořadí].elements[pořadí].value
. První formulář na stránce má pořadové číslo 0, další 1 atd. Stejně tak prvky v rámci formuláře jsou postupně číslovány 0, 1, 2 atd. Přes tato čísla lze JavaScriptem získávat obsah polí. Je to metoda poměrně komplikovaná, nepřehledná a nepružná (při zavedení nového prvku do formuláře musíte přečíslovat skript).
Druhá metoda je závislá na pojmenování (hodnoty atributů name) formuláře a jeho prvků. Hodnotu získáme pomocí vlastnosti document.jméno_formuláře.jméno_prvku.value
, v uvedeném skriptu např. document.form.form2.value
.
Metody pro práci s formuláři
S formuláři pracují tyto metody:
Metoda | Popis |
---|---|
document.form.reset() | Smaže obsah formuláře; ekvivalentní s tlačítkem [reset] |
document.form.submit() | Odešle formulář; ekvivalentní s tlačítkem [submit] |
document.form.prvek.blur() | Deaktivace pohledu na prvek |
document.form.prvek.focus() | Aktivace pohledu na prvek |
document.form.prvek.select() | Vybere obsah prvku |
Místo "form" je třeba zadávat jméno formuláře, místo "prvek" název prvku formuláře. Ukázka:
<form> <input type="text" name="form2"> <input type="button" value="vybrat" onClick="form2.select();"> <input type="button" value="deaktivuj" onClick="form2.blur();"> </form>
Pokud se formulářové metody nachází uvnitř formuláře, není nutné zapisovat ve funkci jméno formuláře.
Další: Kontrola formulářových prvků (checked a radio)
Vyhledávání
Základy
Zajímavosti
DOM
Poradna
Pokud si nevíte rady, chcete kontakt na spolehlivého tvůrce webu, či vás zajímá cizí názor, ozvěte se.