1 / 22

Formuláre v HTML

Formuláre v HTML. Alica Takácsová Lenka Marčišová. 1.Formuláre vo všeobecnosti. používajú sa k výberu rôznych druhov užívateľských vstupov, pre prenos dát na server

gates
Télécharger la présentation

Formuláre v HTML

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Formuláre v HTML Alica Takácsová Lenka Marčišová

  2. 1.Formuláre vo všeobecnosti • používajú sa k výberu rôznych druhov užívateľských vstupov, pre prenos dát na server • typickým príkladom bývajú webové stránky, kde užívateľ zadáva rôzne údaje, a potom ich prostredníctvom potvrdzovacieho tlačítka zašle na server • môže obsahovať vstupné prvky ako sú textové polia, zaškrtávacie políčka, prepínače, tlačidlá pre odosielanie a ďalšie.

  3. Najjednoduchší formulár • <form>značka sa používa na vytvorenie formulára HTML: <formaction="stranka.html"> <inputtype=submitvalue=odeslat> </form>

  4. 2.Najčastejšie typy vstupov: • Textové polia • Heslo • Prepínač • Zaškrtávacie políčka • Tlačidlo pre odosielanie

  5. Textové polia • <inputtype="text"> definuje jeden riadok vstupného poľa, ktoré môže užívateľ zadať <form>Krstné meno: <inputtype="text" name="Krstné meno"><br>Priezvisko: <inputtype="text" name="Priezvisko"></form>

  6. Heslo • <inputtype=„password">definuje pole pre heslo <form>Heslo: <inputtype="password" size="10"name="pwd"></form>

  7. Prepínač • <input type="radio"> umožňuje užívateľovi vybrať iba jeden z obmedzeného počtu možností <form><input type="radio" name="pohlavie" value="Muž">Muž<br><input type="radio" name="pohlavie" value="Žena">Žena</form>

  8. Zaškrtávacie políčka • <input type="checkbox"> ovládací prvok umožňuje zvoliť si jednu alebo viac volieb/možností <form><input type="checkbox" name="vozidlo" value="bicykel">Mám bicykel<br><input type=„checkbox" name="vozidlo" value="auto">Mám auto</form>

  9. Tlačidlo pre odosielanie • <inputtype="submit">tlačidlo odoslať slúži na odoslanie dát formulára na server, na určenú URL adresu <formname="input" action="stránka.html" method="get">meno: <inputtype="text" name="user"><inputtype="submit" value="Submit"></form>

  10. 3.Význam tagov <form> prvok môže obsahovať jeden alebo viac z nasledujúcich prvkov formulára: <option> <optgroup> <fieldset> <label> • <input> • <textarea> • <button> • <select>

  11. HTML <input> Tag

  12. <formaction=„stranka.html"> Krstné meno: <inputtype="text" name="krstné meno"><br> Priezvisko: <inputtype="text" name="Priezvisko"> <br>   <inputtype="submit" value="Submit"> </form>

  13. HTML <textarea>Tag • definuje viacriadkovú textovú vstupnú kontrolu <textarea rows=„2" cols=“20”> </textarea>

  14. HTML <button> Tag • definuje klikacietlačidlo <button> <buttontype="tlačidlo" onclick="alert('Helloworld!')"> ClickMe! </button>

  15. <button> môže obsahovať text aj obrázky

  16. HTML <select> Tag <select> <optionvalue="volvo">Volvo</option> <optionvalue="saab">Saab</option> <optionvalue="opel">Opel</option> <optionvalue="audi">Audi</option> </select>

  17. HTML <option> Tag • definuje voľbu v zozname vyberte • výberz možnostínám ich zobrazí v jednom riadku <select name="platforma" size="1"> <option value="Volvo">Volvo</option><option value="saab">Saab</option><option value="mercedes">Mercedes</option></select>

  18. HTML <optgroup> Tag <select> <optgroup label="Swedish Cars"> <option value="volvo">Volvo</option> <option value="saab">Saab</option> </optgroup> <optgroup label="German Cars"> <option value="mercedes">Mercedes</option> <option value="audi">Audi</option> </optgroup> </select>

  19. HTML <fieldset> Tag • slúži na zoskupenie súvisiacich prvkov vo formulári a nakreslí rámik okolo súvisiacich prvkov <fieldset> <legend>Personalia:</legend> Name: <inputtype="text"><br> Email: <inputtype="text"><br> Dateofbirth: <inputtype="text"> </fieldset>

  20. HTML <label> Tag • poskytuje použiteľnosť na zlepšenie hľadania pre užívateľa <formaction=“stranka.html"> <labelfor="muž">Muž </label> <inputtype="radio" name="pohlavie" id="muž" value="muž"><br> <labelfor="žena">Žena </label> <inputtype="radio" názov="pohlavie" id="žena" value="žena"><br><br> <inputtype="submit" value="Submit"> </form>

  21. Použitá literatúra: • http://www.jakpsatweb.cz/html/formulare.html • http://www.vsl.sk/vyuka/ajax10/formulare.pdf • http://www.w3schools.com/

  22. Ďakujeme za pozornosť

More Related