0 Kč s DPH

3. Pokročilé vlastnosti

Ve vlastním formuláři můžete použít i vstupní pole pro odeslání souborů nebo formulář ochránit před různými spamovacími roboty použitím obrázku, který je nutné opsat (CAPTCHA). Jak toho dosáhnout si ukážeme v následujícím článku spolu s ukázkami použítí složitějších vstupních polí select, checkbox a radio.

1. Pokročilé vstupní pole

Ukázali jsme si, jak použít vstupní pole text (stejným způsobem nadefinujete i velké vstupní pole - textarea), a dále si ukážeme použítí složitějších typů vstupních polí jakými jsou pole typu select, checkbox a radio button (u vstupních polí typu checkbox a radio je dobré v případě povinné položky přednastavit  pole _value na prázný řetězec nebo použít atribut checked pro konkrétní přednastavenou hodnotu).

Výběrová pole (select)

<select name="school[_value]">
<option value="základní">základní</option>
<option value="středoškolské">středoškolské</option>
<option value="vysokoškolské">vysokoškolské</option>
</select>
<input type="hidden" name="school[_title]" value="Dosažené vzdělání" />
<input type="hidden" name="school[_required]" value="1" />

Zaškrtávací tlačítko (checkbox)

<input type="hidden" name="licenses[_value]" value="" />
<input type="checkbox" name="licenses[_value][]" value="A" /> skupina A <input type="checkbox" name="licenses[_value][]" value="B" /> skupina B <input type="checkbox" name="licenses[_value][]" value="C" /> skupina C <input type="hidden" name="licenses[_title]" value="Řidičská oprávnění" /> <input type="hidden" name="licenses[_required]" value="1" />

Přepínací tlačítko (radio)

<input type="radio" name="driver[_value]" value="" />
<input type="radio" name="driver[_value]" value="Ano" /> Ano <input type="radio" name="driver[_value]" value="Ne" /> Ne <input type="hidden" name="driver[_title]" value="Řidičský průkaz" /> <input type="hidden" name="driver[_required]" value="1" />

2. Odeslání souboru přes formulář

Pokud chcete umožnit návštěvníkovi Vašich stránek poslat Vám nějaký soubor (např. životopis v PDF), musíte nastavit dané položce klíč _attachment na hodnotu atributu name vstupního pole typu file. Pomocí klíče _regex je možné omezit typ nahrávaného souboru (ověření poti MIME type souboru). Klíče _title a _value jsou v tomto případě ignorovány - aplikace si tyto údaje automaticky generuje z nahraného souboru.

Následujcí příklad ukazuje nadefinování povinného odeslání životopisu v PDF:

<input type="file" name="at" value="" size="35" />
<input type="hidden" name="cv[_attachment]" value="at" />
<input type="hidden" name="cv[_required]" value="1" />
<input type="hidden" name="cv[_regex]" value="/pdf/" /> 


V každém formuláři můžete mít pouze jeden soubor k odeslání a odesílaný soubor může mít maximální velikost 2 MB.

3. Ochrana proti spamu (CAPTCHA)

Jako ochranu před různými spamovacími roboty používá inPage systém opsání textu z obrázku, který se nazývá CAPTCHA. Tento prvek můžete s určitým omezením použít i ve svých vlastních formulářích. Toto omezení se týká nemožnosti měnit po každém načtení formuláře text obrázku (což není technicky možné). Musíte si tedy sami vybrat jednu jedinou identifikační známku pro CAPTCHU (zobrazte si zdrojový kód Kontaktního formuláře při zapnuté ochraně proti spamům a vyhledejte si hodnotu pole captcha[_captcha], kterou použíjte).

<input type="text" name="captcha[_value]" value="" size="5" maxlength="5" />
<img src="/captcha/89995/" height="20" width="60" />
<input type="hidden" name="captcha[_title]" value="Kontrolní kód" />
<input type="hidden" name="captcha[_captcha]" value="89995" />
<input type="hidden" name="captcha[_required]" value="1" />
<input type="hidden" name="captcha[_regex]" value="/^([0-9]){5}$/" />


Položce, kterou chcete nadefinovat jako CAPTCHU, musíte nastavit klíč _captcha na hodnotu podle výše uvedeného postupu a stejné číslo zadejte jako v url obrázku (/captcha/89995/). Protože by to měla být položka povinná, tak klíč _required nastavit také na 1, a nejlépe i klíč _regex na hodnotu, jaká je uvedena v příkladě, která značí pět číslic.

4. Vlastní závěrečná hlášení

Po stisknutí tlačítka pro odeslání formuláře dojde ke zpracování jednotlivých položek, a pokud je vše v pořádku, tak k odeslání informačního e-mailu a následnému zobrazení textu Odeslání dat z formuláře na náš e-mail bylo úspěšné.

Toto hlášení o úspěšném provedení je možno změnit pomocí proměnné messages[_success] ve skrytém poli (pro neúspěšné zpracování naopak slouží proměnná messages[_error]), např.:

<input type="hidden" name="messages[_success]" value="Děkujeme za vyplnění formuláře" /
<input type="hidden" name="messages[_error]" value="Ouvej - nastala neočekávaná chyba" /

5. Vlastní závěrečná stránka

Pokud obyčejné hlášení nestačí a je nutné po úspěšném odeslání formuláře provést např. zobrazení různých externích javascriptových kódů pro statistiky (např. Google Adwords, Sklik, atd.), je možné nastavit chování formuláře tak, aby po úspěšném provedení formuláře nezobrazil znovu samotný formulář, ale přesměroval se na novou stránku, ve které již jsou potřebné kódy uloženy.

Nastavení přesměrování se provádí pomocí proměnné redirect[_url] ve skrytém poli, kde hodnotou je url existujícího a aktivního článku, např.:

<input type="hidden" name="redirect[_url]" value="podekovani-za-formular" />

Všechny díly seriálu:

  1. Tvorba jednoduchého formuláře
  2. Podrobný popis parametrů
  3. Pokročilé vlastnosti
  4. Validace dat pomocí javascriptu
  5. Příklad

Přidat komentář

Přehled komentářů

  • checkbox

    6.1.2017 21:05:58 | Václav

    Dobrý den, nastavil jsem si na stránkách www.penzionuservace.cz v těle kontaktního formuláře 4 checkboxy - podle objednávaných pokojů. Checkbox se mi zobrazuje, ale informace z checkboxů mi v mailu z formuláře nepřijde. Checkbox se zobrazuje, ale fakticky nefunguje. Prosím, pomůžete mi najít chybu?

    Odpovědět | Zobrazit odpovědi

    • Re: checkbox

      13.2.2017 10:27:55 | Tým inPage

      Dobrý den, ve Vašem případě je checkbox vytvořen mimo samotný formulář. Je třeba si dávat pozor, aby byly všechny další prvky uvnitř formuláře. Pokud jsou mimo prvek form, nebudou se tisknout. Podrobné informace proběhly v emailové konverzaci.

      Odpovědět

  • RE: Pozice CAPTCHA

    12.8.2013 10:01:29 | Vladimír Souš

    Dobrý den, prosím napište mi jméno domény, případně celou URL ať Vám mohu lépe pomoci, takto obecně opravdu nevím v čem je problém. Pěkný den.

    Odpovědět

  • Pozice CAPTCHA

    7.8.2013 12:10:02 | Levan

    Dobrý den, mam problém s (CAPTCHA).
    Zobrazuje se mi vlevo a já bych to potřeboval mít hezky vše pod sebou.

    Odpovědět

  • RE: webový formulář

    6.6.2013 10:00:58 | Vladimír Souš

    Dobrý den, podobný požadavek jsme řešili zde: http://www.stone-art.info/rubrika/ke-stazeni/ takže bych Vám doporučoval podobné řešení, máte-li zájem, mohu Vám zpracovat individální objednávku na zpracování.

    Odpovědět

  • webový formulář

    5.6.2013 17:57:37 | Milan

    Za poskytnutý email návštěvníka mu umožnit odeslání/stažení souboru PDF přes, lépe řečeno prostřednictvím formuláře.Jaká je možnost takovýto webový formulář v inPage vytvořit a umístit ho na úvodní stránku webu.

    Odpovědět

  • RE: podpis - formuláře

    1.10.2012 9:48:20 | Hana Medková

    Dobrý den, toto není chyba ale vlastnost redakčního systému inPage. Na úvodní stránce ani u stránky jež je nastastavena jako Vlastní box nelze podpis připojit. Podpis lze připojit k článku, který má vlastní URL, úvodní stránka webu není článek ale přednastavený odkaz URL www.vase-domena.cz. Článek, který nastavíte jako titulní je k této přednastavené URL připojen (nemá tedy vlastní url /inpage/uvodni-stranka) - proto nejde ten podpis k titulní stránce nastavit. To stejné platí pro NEAKTIVNÍ stránku, která je nastavena jako vlastní box a je tedy součástí přednastavené URL www.vase-domena.cz - tedy také není zobrazen článek na vlastní URL adrese /inpage/vlastni-box.

    Odpovědět

  • podpis - formuláře

    29.9.2012 21:25:19 | Martin K.

    na úvodní stránce a v postranním sloupci nemohu použít funkci "podpis", na ostatních stránkách to funguje, konkrétně bych tam chtěl doplnit určité formuláře, dělám něco špatně? používám šablonu Polaris, díky za odpověď

    Odpovědět

  • Re: Povinné položky

    30.8.2012 13:01:15 | Administrator

    Pouze validací pomocí javascriptu - viz. třetí díl našeho seriálu.

    Odpovědět

  • Povinné položky

    29.8.2012 14:51:28 | Muselík

    Pokud není vyplněna povinná položka, tak to ohlásí, ale předtím vyplněná pole ztratí obsah. Jde to vyřešit, aby se obsah neztrácel a klient nemusel při každé chybě vyplňovat formulář znovu?

    Odpovědět

  • Re: Vyhledávání

    8.2.2011 16:00:32 | inpage

    Dobrý den,
    obraťte se prosím s Vaším dotazem na zákaznickou podporu na admin@zoner.com a vysvětlete tam podrobněji Váš požadavek, nejsem si jistý, co vlastně potřebujete.
    Tým inPage

    Odpovědět

inPage.cz - webové stránky, doména a webhosting snadno.