Kontrola formuláře

Příprava

Pokud máte na stránkách nějaký formulář, jistě byste rádi zkontrolovali, jestli uživatel vyplnil všechna potřebná data. Tak tedy ze všeho nejdříve musíme nějaký ten formulář udělat. Já jsem zvolil celkem pěk kolonek - inputových textových polí - a sice jméno, email, adresa, PSČ a text příspěvku. Do těchto textových polí jsou po tom vypisovány tyto proměnné (tyto proměnné jsou tedy napsány v kolonce Var každého textového pole): jmeno, email, adresa, psc a text.

Pak bude potřeba nějaký statusbar, který bude ukazovat, jestli uživatel vyplnil všechno a v případě, že nevyplnil, aby vypsal, které položky chybí. Já jsem si tedy nakreslil dva obdélníky, jeden modrý, který oznamuje, že zpráva byla úspěšně odeslána a jeden červený, který bude oznamovat chyby - zde tedy ještě vytvořte dynamické textové pole, do Var: zadejte _parent.status. Do této proměnné budou vkládány informace o nevyplněných polích.

Na hlavní scéně pak vytvořte ještě dvě tlačítka - odeslat a reset. Tlačítka to mohou být libovolná, podle vašich představ. Na hlavní scéně dále vytvořte novou vrstvu, do které vložte oba dva movie clipy, které jste vytvořily. Vložte je přes formulář, pojmenujte je "dobre" a "spatne" a zneviditelněte vrstvu.

Základní nastavení

Nejprve bude třeba deklarovat proměnné, které se mají do textových polí vypisovat. To provedeme na prvním snímku hlavní časové osy. Rovnou tam také připíšeme skript, který zneviditelní oba statusbary:

spatne._visible=0;
dobre._visible=0;
jmeno="";
email="@";
adresa="";
psc="";
text="";

Všechny kolonky budou tedy po spuštění animace prázdné, jen položka email bude obsahovat znak zavináče. Stejný skript připojte k tlačítku reset - kdykoliv tedy uživatel klikne na reset, všechny kolonky budou prázdné, kromě emailu, pochopitelně, a případný statusbar se zneviditelní. Takže k tlačítku reset tento skriptík:

on (release){
  spatne._visible=0;
  dobre._visible=0;
  jmeno="";
  email="@";
  adresa="";
  psc="";
  text="";
}

Ještě byste měli vytvořit nějaký křížek, na který když uživatel klikne, tak statusbar zmizí. Nakreslete si nějaký, vložte jej do obou statusbarů a přidejte jednoduchý skript:

on (release) {
  _parent._visible=0;
}

Kontrola údajů

Nyní přijde na řadu kontrola údajů. Kontrola samotná začne po stisknutí tlačítka odeslat, takže veškerý zbylý skript bude přiřazen zde. Nejdřívetedy otestujeme, zda je vyplněné jméno uživatele:

on (release) {
  spatne._visible=1;
  if (jmeno=="") {
    status+="nevyplnili jste jméno" + newline;
  }
}

Takže ze všeho nejdříve musíme zviditelnit instanci "spatne", kde se nachází textové pole, které vypisuje chyby (=vypisuje proměnnou status). Pokud je kolonka jméno prázdná, vepíše se do textového pole obsah proměnné status, tzn. nevyplnili jste jméno. Příkaz newline je kvůli dalších chybám - aby se již vypisovaly na dalším řádku.

Další část skriptu bude kontrolovat, zda uživatel nezapomněl napsat svůj email. Buď je tedy v kolonce pouze zavináč nebo tam není nic. Skriptově to tedy bude vypadat takto:

if (email=="@" or email=="") {
    status+="nevyplnili jste email" + newline;
  }

Pokud nyní nevyplníte ani jednu kolonku, objeví se obě upozornění - nevyplnili jste jméno a nevyplnili jste email. Další položka je adresa, což je opět jednoduchá podmínka:

if (adresa=="") {
    status+="nevyplnili jste adresu" + newline;
  }

Pokud tedy nebude vyplněna adresa, objeví se nápis nevyplnili jste adresu. Čtrvtá kolonka je PSČ. Tady dojde k chybě, nejen pokud bude pole prázdné, ale vlastně vždy, když proměnná psc nebude obsahovat pět znaků. Zapíšeme to tedy takto:

if (psc.length!=5) {
    status+="nenapsali jste správné PSČ" + newline;
  }

No a poslední proměnnou text už zkontrolujeme jednoduše:

if (text==""){
    status+="nevyplnili jste text objednávky" + newline;
  }

Všechny chyby už tedy máme ověřené, zbývá už jen zjistit, kdy je vyplněno všechno správně. K tomu poslouží jedna delší podmínka, kde použijeme negace předchozích podmínek:

if (jmeno!="" && email!="" && email!="@" && adresa!="" && psc.length==5 && text!="") {
    spatne._visible=0;
    dobre._visible=1;
  }

Pokud je tedy vše vyplněno správně, skryje se okno spatne, které jsme na začátku otevřeli a otevře se okno dobre, kde bude naspáno, že zpráva byla odeslána.

Chyba

Určitě jste si všimli, že pokud jste podruhé zkontrolovaly údaje, v textovém poli zůstaly i ty předchozí chyby. Řešení je naštěstí jednoduché, stačí přidat na začátek testování pod událost on (release) tento příkaz: status="";, čímž při každém kontrolování vynulujeme proměnnou status. Celý skript na tlačítku "odeslat" tedy nakonec bude vypadat takto:

on (release) {
  status="";
  spatne._visible=1;
  if (jmeno=="") {
    status+="nevyplnili jste jméno" + newline;
  }
  if (email=="@" or email=="") {
    status+="nevyplnili jste email" + newline;
  }
  if (adresa=="") {
    status+="nevyplnili jste adresu" + newline;
  }
  if (psc.length!=5) {
    status+="nenapsali jste správné PSČ" + newline;
  }
  if (text==""){
    status+="nevyplnili jste text objednávky" + newline;
  }
  if (jmeno!="" && email!="" && email!="@" && adresa!="" && psc.length==5 && text!="") {
    spatne._visible=0;
    dobre._visible=1;
    //nějaký další skript na odeslání dat
  }
}
Prohlédnout
Stáhnout zdrojový soubor

hlavní stránka # o tento web se stará Lukáš Havrlant # lukas.havrlant@gmail.com