Hlavní nabídka: |
Základy
Reference
Příklady
|
|
|
Kontrola údajů ve formuláři
Na začátku serie článků o formulářích jsme se dozvěděli, že je jednou z výhod JS kontrola údajů už na straně klienta. V tomto článku se dozvíte jak.
Každý formulář na internetu by měl být takzvaně "ošetřený". Co to znamená? Každý prvek formuláře, především ten, který ovlivňuje návštěvník, by měl mít danou formu, která odpovídá jeho významu. Na příkladu si předvedeme, jak ošetřit pole e-mail:
<HTML>
<HEAD>
<TITLE>Kontrola údajů ve formuláři</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
function kontrola(mail)
{
if (mail.indexOf("@")==-1)
{
document.formular.vysledek.value="Zadal jsi NESPRÁVNOU "+
"e-mailovou adresu! Zadej ji znovu!";
return false;
}
else return true;
}
// -->
</SCRIPT>
</HEAD>
<BODY>
<FORM NAME="formular" ACTION="/" onSubmit="return kontrola(email.value);">
<INPUT TYPE="text" NAME="vysledek" SIZE="55"
VALUE="Zadej svoji e-mailovou adresu a klikni na Odešli!">
<P>E-mail:
<INPUT TYPE="text" NAME="email" SIZE="25" VALUE="">
<INPUT TYPE="submit" VALUE="Odešli">
</FORM>
</BODY>
</HTML>
Pro výsledek klikněte ZDE.
Vysvětlení činnosti:
Abychom lépe pochopili tento příklad, budeme muset vysvětlit jednotlivé prvky napřeskáčku. Začneme tedy sekvencí tagu pro formulář. Tento formulář jsme si pojmenovali jako formular. Formuláři jsme taktéž přiřadili ovládač událostí onSubmit, který po aktivaci formuláře vrátí hodnotu z funkce kontrola(), viz dále. email.value zde představuje hodnotu z pole email (viz dále). Dále jsme formuláři přiřadili dvě textová pole. V jednom se bude vypisovat chybové hlášení při špatném zadání e-mailu (pojmenovali jsme jej vysledek) a do druhého bude návštěvník vepisovat svůj e-mail (pojmenovali jsme jej email). Nakonec jsme ještě přidali tlačítko pro odeslání formuláře. A nyni JS stránce formuláře. Vytvořili jsme si funkci kontrola(mail), ve které mail zastupuje hodnotu e-mailu. V ní jsme nadefinovali podmínku if (mail.indexOF("@")==-1). Tato podmínka bude splněna, když hodnota e-mailu (e-mailová adresa) nebude obsahovat @. Museli jsme použít -1, protože počet se začíná od 0, což je pro nás obsah 1 zavináče, tudíž 0 @ musí být zapsáno jako -1. Když tedy bude tato podmínka platit vypíše se díky sekvenci document.formular.vysledek.value chybové hlášení do textového pole, které jsme si označili jako vysledek ve formuláři, který jsme si označili jako formular. Když tato podmínka nebude splněna, čili e-mail bude obsahovat @, a bude tedy správně zadán, vrátí funkce hodnotu true a formulář se odešle na adresu, která je uvedena v prvku action v tagu form. Nahradíte tedy "/" v tomto příkladu.
16.03.2002 | Formuláře | David Havlíček
|
|
Dnes je 15. 11. 2024 Svátek má Leopold | |
Bleskové aktuality: |
10.12.2002 Dlouho jsme tu neměli příklady, tak co kdybychom si dneska jeden dali?
07.12.2002 Poslední operáty, které si představíme, jsou speciální.
02.12.2002 Po delší pauze si představíme další operátory - řetězcové.
17.11.2002 Next operátory jsou přiřazovací.
10.11.2002 Jedněmi z posledních operátorů jsou porovnávací.
02.11.2002 Už jste slyšeli o logických operátorech? Pár jich taky je.
29.10.2002 Dalšími operátory jsou bitové.
26.10.2002 Dnes si představíme první z řady operátorů - aritmetické operátory.
24.10.2002 Další částí referencí jsou příkazy.
18.10.2002 Dnes se mrkneme na referenční přehled funkcí.
12.10.2002 Window je objekt, který má snad nejvíce metod a vlastností, tak se mu dnes podíváme na zoubek.
06.10.2002 Netradičně v neděli další objekt - string.
28.09.2002 Další sobota. Další objekt - screen.
21.09.2002 Hodně používáný je objekt navigator. Proto se na něj dneska zaměříme.
14.09.2002 Po týdenní pauze další referenční článek o objektu - tentokrát Math.
07.09.2002 Objekt location bude náš dnešní cíl.
04.09.2002 Na paškál si tentokrát vezmeme objekt history.
|
|
|