Elemente koje želimo prikazati u formi umećemo unutar <form> elementa. Svojstva:
action = URL - gdje formu obrađujemo nakon pritiska gumba Submit
method = get | post - http metoda pomoću koje se šalju podatci
onsubmit - naziv funkcije za obradu pritiska gumba Submit
onreset - naziv funkcije za obradu pritiska gumba Reset
name - služi pristupu elementima forme kod skriptiranja
Vrijednost svojstva type <input> elementa određuje način unosa:
- tekst (svojstvo type="text")
- zaporka (svojstvo type="password")
- polje za potvrdu (svojstvo type="checkbox")
- kružić opcija (svojstvo type="radio")
- sumbit gumb (svojstvo type="submit")
- reset gumb (svojstvo type="reset")
- skriveni podatak (svojstvo type="hidden")
type - vrsta elementa za unos podataka
name - šalje se kao dio forme
value - koristi se kod polja za potvrdu i kružića opcija
checked - koristi se kod polja za potvrdu i kružića opcija
size - specifično za svaku vrstu elemenata
maxlength - maksimalan broj znakova za tekstne elemente
tabindex - položaj u prebacivanju elemenata tipkom tab
onfocus - funkcija koja se poziva kada element dobije fokus
onblur - funkcija koja se poziva kada element izgubi fokus
onchange - funkcija koja se poziva nakon promijene vrijednosti
<script language="javascript" type="text/javascript">
//<![CDATA[
function unos() {
if (document.mojaforma.ime.value == "Ivan")
document.mojaforma.prezime.value = "Horvat";
}
//]]>
</script>
<form name="mojaforma">
Ime: <input type="text" name="ime" size="30" onblur="unos();" />
Prezime: <input type="text" name="prezime" maxlength="8" />
</form>
<script language="javascript" type="text/javascript">
//<![CDATA[
function unos() {
var zaporka = document.mojaforma.pass1.value;
if(zaporka.trim().length <= 5)
alert("Zaporka je prekratka!");
}
//]]>
</script>
<form name="mojaforma">
Password: <input type="password" name="pass1" maxlength="8" />
Again: <input type="password" name="pass2" onfocus="unos();" />
</form>
<script language="javascript" type="text/javascript">
//<![CDATA[
function unos() {
if (document.mojaforma.puno.checked == true &&
document.mojaforma.vozacka.checked == true)
alert("Osoba je punoljetna i ima vozačku dozvolu.");
}
//]]>
</script>
<form name="mojaforma">
Punoljetna: <input type="checkbox" name="puno" checked />
Vozačka dozvola: <input type="checkbox" name="vozacka" onchange="unos();" />
</form>
<script language="javascript" type="text/javascript">
//<![CDATA[
function unos() {
if(document.mojaforma.dob[0].checked)
document.getElementById('box').style.visibility = 'visible';
else
document.getElementById('box').style.visibility = 'hidden';
}
//]]>
</script>
<form name="mojaforma">
Mladost: <input type="radio" name="dob" onchange="unos();" />
Zrelost: <input type="radio" name="dob" onchange="unos();" checked />
<div id="box" style="visibility:hidden;">Vrijeme odrastanja.</div>
</form>
<script language="javascript" type="text/javascript">
//<![CDATA[
function unos() {
if (document.mojaforma.grad[1].selected == true)
alert("Nima Splita do Splita");
}
//]]>
</script>
<form name="mojaforma">
<select name="grad" onchange="unos();">
<option>Zagreb</option>
<option>Split</option>
<option selected>Rijeka</option>
<option>Osijek</option>
</select>
</form>