Umíme ve Flashi – 16. díl – návštěvní kniha II.

V dnešním díle přidáme do návštěvní knihy funkce pro kontrolu správnosti vstupních údajů, vysvětlíme a popíšeme si nově použitou komponentu Alert a nakonec se zmíníme o správném kódování zdrojových dat knihy.

Kontrola vstupních údajů

Návštěvní kniha z minulého dílu umožňuje základní funkce, které od této aplikace požadujeme. Jedná se o zápis vstupních dat do souboru a o funkci pro jejich přečtení a zobrazení v textovém poli. Jako vylepšení dnes přidáme kontrolu správnosti vstupních údajů. Nechceme totiž, aby se v návštěvní knize vyskytovaly prázdné hodnoty apod.

Než začneme psát skript pro kontrolu vstupních údajů, upravíme vstupní textová pole tak, že vedle polí připíšeme popisy, označující, co se v kterém poli má objevit a přímo z textových polí vymažeme ukázkový text (zdrojový soubor knihy z minulého dílu je k dispozici zde).

Klepněte pro větší obrázek

Upravený formulář pro zadávání vstupních údajů

Skript, kontrolující správnost vstupních údajů, bude zjišťovat délku textu, který je v jednotlivých textových polích vložen. Pokud bude délka menší než 1, znamená to, že do daného pole není vložen žádný text. Dále budeme kontrolovat obsah textového pole pro vložení emailové adresy. Zde, kromě délky textu, budeme zjišťovat přítomnost symbolu „@“. V případě, že nebude přítomen, je zřejmé, že adresa není vyplněna správně.

Podíváme se na akce prvního snímku hlavní časové osy a doplníme skript pro kontrolu vstupních údajů:

import mx.controls.Alert;
chckFields = function () {
 errText = "";
 if (form.jmeno.text.length<1) {
  errText += "Nebylo vyplěno jméno; ";
 }
 if (form.mail.text.length<1 || form.mail.text.indexOf("@") == -1) {
  errText += "Nesprávná emailová adresa; ";
 }
 if (form.urls.text.length<1) {
  errText += "Není zadaná www adresa; ";
 }
 if (errText.length>1) {
  textAlert = "Formulář nebyl správně vyplněn, prosím opravte tyto chyby:"+newline+errText;
  Alert.show(textAlert, "Vyskytly se chyby v odesílané zprávě", Alert.OK);
  return false;
 } else {
  return true;
 }
};

V tomto skriptu využíváme flashovou komponentu „Alert“, pomocí které zobrazíme chyby v nesprávně vyplněných políčkách. Aby skript fungoval, musíme do knihovny dokumentu vložit komponentu Alert (můžeme komponentu vložit přímo do knihovny, nebo ji přetáhneme na scénu a poté ji na ploše vymažeme)

Alert komponenta

Protože jsme se touto komponentou ještě nezabývali, ve stručnosti si jí popíšeme. Uvedená komponenta se využívá v případech, kdy chceme uživatele upozornit na nějakou událost a nabídnout mu další postup. Komponenta umožňuje zobrazení dvou tlačítek, nejčastěji se jedná o tlačítka OK a CANCEL nebo YES a NO.

Použití této komponenty má navíc tu výhodu, že deaktivuje veškerá tlačítka a objekty na scéně, uživatel tak musí zvolit jednu z nabízených možností dalšího postupu. Metodou Alert.show() zobrazíme komponentu na scéně, jejíž vzhled a funkčnost ovlivňují tyto parametry:

  • message – text zobrazený v okně komponenty
  • title – text v horní části komponenty
  • flags – nepovinný parametr, pomocí kterého máme možnost určit, která tlačítka budou v okně komponenty zobrazena. Možné hodnoty jsou Alert.OK, Alert.CANCEL, Alert.YES a Alert.NO
  • parent – okno, vůči kterému se komponenta zarovnává, defaultně je nastavena hodnota _root
  • clickHandler – zde lze uvést funkci, která se vykoná po kliknutí na jedno z tlačítek komponenty
  • icon – ikonka, která se zobrazí v levé části komponenty
  • defaultButton – pomocí tohoto parametru lze určit tlačítko, které je označené jako první, možné hodnoty jsou totožné jako v případě parametru flags

Funkce kontroly

Vložili jsme novou funkci, která provádí kontrolu obsahu vstupních polí. Pokud je vše v pořádku, vrátí funkce hodnotu true. V případě chyby dojde k zobrazení komponenty Alert, ve které je uveden seznam chyb, které se vyskytly. Dále v případě chybného vyplnění některého z políček vrátí funkce kontroly hodnotu false.

Dalším postupem bude vyčlenění části kódu, která se stará o načítání dat, z funkce, kterou jsme umístili na tlačítko pro odesílání zpráv. Tento kód vložíme do nové funkce, pojmenované „loadVzkazy“:

loadVzkazy = function () {
 var vzkazy:LoadVars = new LoadVars();
 vzkazy.onLoad = function(success:Boolean) {
  if (success) {
   if (firstStart != false) {
    texty.text = vzkazy.texts;
   } else {
    form.gotoAndStop(2);
    texty.text = vzkazy.texts;
   }
   firstStart = false;
  } else {
   texty.text = "Chyba aplikace";
  }
 };
 var vzkaz:LoadVars = new LoadVars();
 vzkaz.jmeno = form.jmeno.text;
 vzkaz.vzkaz = form.vzkaz.text;
 vzkaz.mail = form.mail.text;
 vzkaz.url = form.urls.text;
 if (firstStart != false) {
  vzkaz.Odeslano = "ne";
 } else {
  vzkaz.Odeslano = "ano";
 }
 vzkaz.sendAndLoad("gb.php", vzkazy, "POST");
};
var odesilatel:Object = new Object();
odesilatel.click = function(evt:Object) {
 chck = chckFields();
 if (chck) {
  loadVzkazy();
 }
};
loadVzkazy();

Trochu netradičně se podíváme na spodní řádek, kde voláme funkci „loadVzkazy“. Funkci zde voláme, protože chceme zobrazit obsah návštěvní knihy ihned při načtení swf souboru. Pokud bychom ovšem nechali skript funkce „loadVzkazy“ bez úpravy, automaticky by nám přeskočil MC s formulářem na snímek číslo dva, kde informujeme o správném odeslání dat. Z toho důvodu vložíme na začátek funkce „loadVzkazy“ podmínku, kde testujeme první spuštění uvedené funkce.

Pokud se tak stalo, načteme hodnoty návštěvní knihy bez přeskoku na druhý snímek MC s formuláři. Na konci funkce „loadVzkazy“ musíme provést podobnou úpravu, která zajistí, že php kód pouze načte data z txt souboru. Úprava se týká proměnné „Odeslano“, která v případě jiné hodnoty než „ano“ zajistí v php skriptu načtení obsahu návštěvní knihy bez uložení dat.

Php strana nedozná žádných změn, pouze se zde zmíníme o formátu, ve kterém se data ukládají. V minulém díle jsme se nevěnovali kódování, které je v tomto případě velmi důležité. Je totiž nutné, aby zdrojová data byla kódovaná v UTF-8. Toto kódování lze nastavit tak, že soubor gb.txt uložíme v editačním programu (např. poznámkový blok) s UTF-8 kódováním a stejný proces provedeme se souborem gb.php. Po této změně bude návštěvní kniha správně zobrazovat i české znaky.

Po uvedených úpravách a nahráním potřebných souborů na server se návštěvní kniha zobrazí v této podobě.

Zdrojové soubory dnešní ukázky jsou k dispozici zde.

Témata článku: Software, Programování, Alert, Success, Cancel, Icon

1 komentář

Nejnovější komentáře

  • gully, gully 23. 1. 2006 10:27:32
    http://diskuse-zaciname-s-flash-mx-2004.wz.cz
Určitě si přečtěte

Sbíječky vyměnili za klávesnice. Nový projekt má za cíl přeučit horníky na programátory

Sbíječky vyměnili za klávesnice. Nový projekt má za cíl přeučit horníky na programátory

** Programátorů je málo a horníků bez práce po uzavření dolu Paskov bude moc ** Problém řeší unikátní projekt ** Pilotní kurz dává naději, že by z horníků mohli být použitelní kodéři

28.  11.  2016 | David Polesný | 79

ASUS ZenBook 3 se začal prodávat v Česku. Je ve všem lepší než MacBook, ale bude to stačit?

ASUS ZenBook 3 se začal prodávat v Česku. Je ve všem lepší než MacBook, ale bude to stačit?

** Novinka od Asusu míří přímo proti MacBooku od Applu ** Nabídne daleko více výkonu za stejné peníze

2.  12.  2016 | David Polesný | 127