Vytvořte program pro prvky formuláře pro html. Vytváření formulářů v HTML. Příklad vytvoření krásného HTML formuláře
Nejnovější aktualizace: 08.04.2016
Jednořádkové textové pole se vytvoří pomocí vstupního prvku, když je jeho atribut type nastaven na text:
Pomocí série další atributy Textové pole si můžete přizpůsobit:
dirname: nastavuje směr textu
maxdélka: max přípustné množství znaků v textovém poli
vzor : definuje vzor, kterému by měl odpovídat vstupní text
zástupný symbol : Nastaví text, který se ve výchozím nastavení zobrazí v textovém poli
readonly : Nastaví textové pole pouze pro čtení
povinné : označuje, že textové pole musí mít hodnotu
velikost: nastavuje šířku textové pole ve viditelných znacích
hodnota : Nastaví výchozí hodnotu v textovém poli
Aplikujme některé atributy:
V tomto příkladu druhé textové pole okamžitě nastaví atributy maxlength a size. V tomto případě velikost – tedy počet znaků, které se vejdou do viditelného prostoru pole, je větší než povolený počet znaků. Stále však nebudeme moci zadat více znaků, než je maximální délka.
V v tomto případě Je také důležité rozlišovat mezi atributem value a zástupným symbolem, i když jsou oba nastaveny viditelný text v terénu. Zástupný symbol však nastavuje nějakou nápovědu nebo výzvu pro vstup, takže je obvykle označen šedá. Zatímco hodnota představuje výchozí text zadaný do pole:
Atributy readonly a disabled činí textové pole nepřístupným, ale jsou doprovázeny různými vizuální efekt. V případě deaktivace je textové pole zašedlé:
Mezi atributy textového pole stojí za zmínku také atribut jako list . Obsahuje odkaz na prvek datalist, který definuje sadu hodnot, které se po zadání do textového pole zobrazí jako nápověda. Například:
Atribut seznamu textového pole ukazuje na id prvku datalist. Samotný prvek datalist definuje prvky seznamu pomocí vnořených prvků voleb. A když zadáte text do textového pole, tento seznam se zobrazí jako nápověda.
Vyhledávací pole
Používá se k vytváření vyhledávacích polí vstupní prvek S atribut typu="hledat" . Formálně se jedná o jednoduché textové pole:
Pole hesla
Pro zadání hesla použijte vstupní prvek s atributem type="password". Jeho charakteristický rys je, že zadané znaky jsou maskovány tečkami:
U velkých textů např. pro poštovní zprávy, je vhodné použít tento konkrétní prvek. Je tvořen tagy a má následující parametry:
– jméno- název pole,
– sloupce- šířka pole ve znacích,
– řádky- počet řádků textu viditelných na obrazovce,
– zabalit- způsob přenosu slov:
– vypnuto- neprobíhá žádný převod,
– virtuální- přenos se zobrazí, ale server obdrží nedělitelný řetězec,
– fyzikální- přenos jak na obrazovce, tak po příjezdu na server.
– zakázáno- neaktivní pole,
– pouze pro čtení- povoleno pouze pro čtení.
Výsledek:
Rozbalovací seznamy
Seznamy mohou být jednopoložkové nebo s vícenásobným výběrem. Oba jsou specifikovány pomocí značek , uvnitř kterých jsou umístěny prvky hodnot specifikovaných tagem Podívejme se na parametry těchto značek:
– jméno- název seznamu. Každý vybraný prvek seznamu při přenosu na server bude mít tvar: name.value, kde hodnota je převzata z tagu option;
– velikost- určuje množství viditelné prvky v seznamu: 1 - jednoduchý rozevírací seznam, více než 1 - seznam s posuvníkem;
– násobek- Umožňuje výběr více položek seznamu.
– vybraný- používá se k označení prvku seznamu, který bude s největší pravděpodobností vybrán, pokud má seznam více možností, lze označit několik položek;
– hodnota- hodnota, která bude odeslána na server, pokud je položka vybrána.
Jaký jazyk se chcete naučit:
Kolik času jste ochotni tomu věnovat:
Které dny v týdnu vám vyhovují pro kurzy:
(vyberte stisknutím tlačítka klávesu ctrl)
Výsledek:
Nechybí ani značky<optgroup>… , což vám umožní seskupit prvky seznamu podle určitých kritérií. Chcete-li například vytvořit katalog stránek ve formě seznamu, je výhodnější jej rozdělit do skupin podle zájmu. Upozorňujeme, že v tomto případě je nutné zadat uzavírací značky. Ukázkový kód:
Katalog stránek:
Výsledek:
Nápisy
Všechny prvky formuláře lze pomocí prvku přiřadit k jejich štítkům a jeho parametr pro, jehož hodnota je název prvku, se kterým štítek spojujeme. Například:
Výsledek:
Pracovní podmínka
Podle volby vytvořte formulář pro zadání dat. Stránka by měla obsahovat následující vizuální prvky:
1. titul;
2. text vysvětlující účel formuláře;
3. formulář pro zadávání údajů v souladu s opcí. Sami vyberte typy prvků pro zadávání dat (alespoň 3 různé);
4. kopání – “ POSLAT», « JASNÝ»;
5. informace o tvůrci stránky – Celé jméno, skupina, e-mail.
Obrázek 1 – Přibližný pohled stránky
Přidejte tlačítko do každého pole formuláře Vysvětlení", po kliknutí se otevře okno s vysvětlujícími informacemi nebo obrázkem, tlačítko " BLÍZKO».
Když stisknete tlačítko " POSLAT", zkontroluje se správnost údajů formuláře - všechna pole jsou vyplněna, číselná pole obsahují platné hodnoty, odstraní úvodní a koncové mezery. Pokud se údaje v jednom nebo více polích neshodují, mělo by se zobrazit okno s názvem a krátkým textem vysvětlujícím požadavky na údaje zadané do pole. Pokud jsou údaje zadány správně, jsou po potvrzení v dialogovém okně údaje odeslány. Umístěte dva na formulář skrytá pole S aktuální datum a čas, které jsou také přenášeny na server. Přibližná forma:
Obrázek 2 – Přibližný pohled na formulář pro zadání dat
Tabulka 1 – Možnosti formulářů pro zadávání dat
| Volba | Popis |
| Workshop, oblast, celé jméno Objem odvedené práce | |
| UDC, celé jméno Autor, jméno, množství | |
| Číslo vlaku, Název, Místo odjezdu, Místo příjezdu, Kategorie | |
| Organizace, celé jméno, rok narození, Rušné místo | |
| Země, Oblast, Obyvatelstvo, Kontinent, Hlavní město | |
| Značka vozu, Číslo, Barva, Rok výroby, Stav km | |
| Plemeno psa, Přezdívka, Otec, Matka, Datum narození, Celé jméno majitele | |
| Druh zeleniny, Název odrůdy, Datum výsadby, Datum sklizně, Sklizeň | |
| Disciplína, Rozsah přednášek, Rozsah cvičení, Typ řízení, Skupina | |
| Datum, teplota, tlak, oblačnost, směr větru | |
| Název, Společnost, Cena, Množství, Datum | |
| Název kapely, Země, Album, Datum vydání, Prodejní číslo | |
| Název vrcholu, Nadmořská výška, Země, Rok dobytí, Počet výstupů | |
| Celé jméno, rok narození, výška, váha, krevní skupina | |
| Celé jméno, Obor činnosti, Rok narození, Země, Počet publikací |
Bezpečnostní otázky
1. Popište značku pro vytvoření textového pole. Uveďte jeho syntaxi.
2. Popište tag pro vytvoření textového pole pro zadání hesla. Uveďte jeho syntaxi.
3. Popište značku pro vytváření zaškrtávacích políček. Uveďte jeho syntaxi.
4. Popište značku pro vytváření tlačítek. Uveďte jeho syntaxi.
5. Popište značku pro vytvoření pole pro výběr souboru. Uveďte jeho syntaxi.
6. Popište značku pro vytvoření víceřádkového textového pole. Uveďte jeho syntaxi.
7. Popište značku pro vytvoření rozevíracího seznamu. Uveďte jeho syntaxi.
Učitel Stishenok E.O.
Farberov A.G.
Tento prvek formuláře je navržen tak, aby vytvořil oblast, do které můžete zadat více řádků textu. V takovém textovém poli je povoleno provádět zalomení řádků, které se ukládají při odesílání dat na server.
Pole pro víceřádkový text nepostradatelné pro přidávání komentářů k článkům, psaní příspěvků na fóru, vkládání a úpravu blogových příspěvků a v mnoha dalších případech, kdy jeden řádek textu zjevně nestačí.
Syntaxe pro vytvoření pole je následující.
Mezi tagy Do pole můžete umístit libovolný text, který se zobrazí. Pokud zde není žádný text, bude pole zpočátku prázdné.
Platné atributy jsou uvedeny v tabulce. 1.