| Výuka > JavaScript > Formuláře |

Formuláře

V této části si představíme základní formulářové prvky, které je možné vkládat do webové stránky. Touto problematikou se začínáme zabývat až v tomto okamžiku, neboť samotné HTML dokáže formulářové prvky pouze zobrazovat, nedokáže s nimi ale dále spolupracovat. Vlastní funkčnost je ponechána na skriptovacím jazyku, který dokáže z formuláře data zpracovat.

Vstupní formulářové prvky

Nyní se tedy seznámíme s párovou značkou <input>, která vytváří příslušný formulářový prvek. Tato značka má povinný parametr type=" ", jež pevně stanovuje vzhled formulářového prvku. Dále můžeme využít i dalších parametrů, např. name="jmeno_prvku", který se používá k pojmenování příslušného prvku, value="hodnota" pro určení hodnoty tohoto prvku, atp. Další parametry budou zmíněny u jednotlivých ukázek. Nyní se tedy již seznámíme s jednotlivými typy formulářových prvků:

Textové políčko

<input type="text" name="policko1"
       size="20" maxlength="6">

Zkuste umístit kurzor do tohoto prvku a zapsat jakýkoli text.



Políčko pro heslo

<input type="password" name="heslo"
       size="20" maxlength="6">

Zkuste umístit kurzor do tohoto prvku a zapsat jakýkoli text.



Přepínač

<input type="radio" name="skupina"
       value="prvek1"> Prvek č.1 </input>
<input type="radio" name="skupina"
       value="prvek2"> Prvek č.2 </input>

Zkuste kurzorem změnit prvek.

Prvek č.1
Prvek č.2

Zaškrtávací políčko

<input type="checkbox" name="ridicak"
       value="A"> A </input>
<input type="checkbox" name="ridicak"
       value="B"> B </input>

Zkuste kurzorem zvolit prvky.

A
B

Obecné tlačítko

<input type="button" name="tlacitko1"
       value=" tlačítko ">

Takto vypadá prvek obecné tlačítko.



Odesílací tlačítko

<input type="submit">

Takto vypadá prvek odesílací tlačítko.



Rušící tlačítko

<input type="reset">

Takto vypadá prvek rušící tlačítko.



Obrázkové tlačítko

<input type="image" src="tlacitko.gif">

Takto vypadá obrázkové tlačítko.



Skrytý formulářový prvek

<input type="hidden" value="skrytá hodnota">

Ostatní formulářové prvky

Při práci s formuláři se využívá ještě dalších prvků, které jsou uvedeny v následujícím přehledu:

Textové pole

<textarea cols="20" rows="4"
          name="zprava"> </textarea>

Toto je textové pole. Zkuste do něj něco vepsat.



Výběrový seznam

<select name="jmeno">
 <option> Volba 1 </option>
 <option> Volba 2 </option>
 <option> Volba 3 </option>
</select>

Toto je výběrový seznam.



30.08.2007, 21:29 vytvořil Administrator