Praneškite apie mus:


HTML formos

0

HTML formos yra naudojamos įvairiausio tipo duomenų įvedimui apdoroti. Viename puslapyje gali būti kelios formos.



Forma, tai elementas, kuris savyje talpina formos elementus.

Formos elementai, tai elementai, kurie leidžia vartotojui įvesti informaciją į formą.

  • teksto laukai - text ir textarea
  • išsiskleidžiantys pasirnkimo meniu - select
  • radijo myktukai - radio
  • kontrolinio įvedimo elementai - checkbox

Formos pradžia nurodoma su <form> žyme ir pabaiga su </form>

 

Įvedimas

Labiausiai formose naudojama žymė yra <input>, kuri nurodo įvedimą. Įvedimo tipas nurodomas <input> žymės parametre type. Žemiau yra paaiškinti pagrindiniai įvedimo tipai.

 

HTML formos - teksto laukai

Teksto laukai yra naudojami kai norite leisti vartotojui įvesti informaciją raidžių, skaičių ar kitų simbolių pavidalu.

 

1
2
3
4
5
6
7
<form>
Vardas:
<input type="text" name="vardas">
<br />
Pavardė:
<input type="text" name="pavarde">
</form>

 

rezultatas:

 

Vardas:
Pavardė:

 

Pastaba: pačios formos niekur nesimato. Taip pat daugelyje naršyklių teksto laukų plotis pagal nutylėjimą yra 20 simbolių.

 

pabandyk_pats

 

HTML formos - radijo mygtukai

Radijo mygtukai yra naudojami, kai norite leisti vartotojui pasirinkti vieną iš pateiktų variantų.

 

1
2
3
4
<form>
<input type="radio" name="lytis" value="vyras"> Vyras<br>
<input type="radio" name="lytis" value="moteris"> Moteris
</form>

 

rezultatas:

 

Vyras
Moteris

 

pastaba: radio mygtukai yra naudojami tada, kai norime leisti pasirinkti tik vieną variantą

 

pabandyk_pats

 

Kontrolinio įvedimo elementas - checkbox

Šis tipas yra naudojamas, kai norima suteikti vartotojui galimybę pasirinkti kelis variantus iš visų pateitkų

 

1
2
3
4
5
6
7
8
9
10
<form>
Aš myliu tėtį:
<input type="checkbox" name="myliu" value="teti">
<br />
Aš myliu sesę:
<input type="checkbox" name="myliu" value="sese">
<br />
Aš myliu Gerdą:
<input type="checkbox" name="myliu" value="gerda">
</form>

 

rezultatas:

 

Aš myliu tėtį:
Aš myliu sesę:
Aš myliu Gerdą:


pabandyk_pats

 

HTML formos - atributas action ir duomenų pateikimo mygtukas

Kai vartotojas paspaudžia duomenų pateikimo mygtuką (submit), tada formos duomenys yra išsiunčiami serveriui. Formos action atribute nurodoma koks failas priims siunčiamus duomenis.

 

1
2
3
4
5
<form name="input" action="html_formos_ivedimas_pvz.php" method="get">
Vardas:
<input type="text" name="vardas">
<input type="submit" value="Siųsti">
</form>

 

rezultatas:

 

Vardas:

 

pabandyk_pats

 

Jei įvesite duomenis į šį lauką, jie bus išsiųsti serveryje patalpintam failui html_fromos_ivedimas_pvz.php ir jame esantis kodas priėmęs duomenis, juos išves į naršyklę. Kaip sukurti tokio tipo failus galite pažiųrėti php pamokose.

 

Pavyzdyje naudoto php failo kodas:


1
2
3
4
sų įvestas vardas:<br />
<?php
print($_GET['vardas']);
?>

 

HTML formų žymės

 

ŽymėAprašymas
<form> Nurodo formos pradžią
<input> Nurodo įvedimo lauką
<textarea> Nurodo kelių eilučių įvedimo lauką
<label> Nurodo etiketes
<fieldset> Nurodo laukų komplektą
<legend> Nurodo laukų komplekto antraštę
<select> Nurodo pasirinkimo sąrašą
<optgroup> Nurodo pasirinkimo grupę
<option> Nurodo pasirinkimą drop-down grupėje
<button> Nurodo mygtuką
<isindex> Nevartotinas. Naudokite žymę <input>

 

Visos žymės pagal abecelę

Visos žymės pagal funkcijas

 

Pavyzdžiai

pabandyk_pats Išskleidžiamo pasirinkimo įvedimas
pabandyk_pats Duomenų pateikimo mygtukas
pabandyk_pats Fieldset pavyzdys

Perskaityta: 5700 kartų

Lukas
Autorius: Lukas
El. paštas.: Šis el. pašto adresas yra apsaugotas nuo spam botų. Jum reikalingas įjungtas Javasctipt kad jį matytumėte
Manualai.lt tinklo autorius ir administratorius. VDU Energetikos Fizikos ir Verslo Informatikos studentas. LinkedIn
Raktažodžiai
html    pagrindai    žymės    žinynas    pradmenys   
Patinka straipsnis?
Komentarai

Komentarų nėra. Norėdami komentuoti turite prisijungti