Forme služe za prikupljanje informacija od posetilaca stranice.

Na formi može postojati veći broj kontrola koje se zadaju odgovarajućim tagovima.

HTML forme se najčešće koriste za prikupljanje podataka koje unose korisnici. Ti podaci koje korisnici unesu se najčešće šalju na server na obradu.
Tag koji nam je potreban za to je <form>. 

( .... Inače, ovo bi trebalo da je obrađivano u okviru predmeta Web dizajn, u toku drugog razreda, pa se stoga ovde neće objašnjavati svi detalji. Umesto toga ćete dobiti smernice kako da se podsetite najvažnijih pojmova tako što ćete pogledati reference ili tutorijale na w3schools-u .... )

Prvi zadatak sa časa:

Kreirati folder Forma1 i njemu fajl forma1.html. U njemu ćemo uneti jednu formu:

(u nastavku je samo forma koju pišemo na času)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>

<h1> Naslov</h1>
<hr>
<form>
  <label for="ime"> Vaše ime : </label>
  <input type="text" id="ime" name = "ime">
  <br>
  <label for="prezime"> Vaše prezime: </label>
  <input type="text" id="prezime" name="pprezime">
 <br>
 <input type="button" id="dugme" name="dugme" value="OK" onclick="poruka()">

</form>
<script>
 //ovde ide funkcija za poruku prilikom klika na dugme
   function poruka() {
         var unesenoIme = document.getElementById("ime").value;
         var unesenoPrezime = document.getElementById("prezime").value;
         alert(unesenoIme + " " + unesenoPrezime);
     }

</script>

</body>
</html>

Napomena: Prilikom klika na dugme se poziva funkcija poruka(). U njoj treba da se pristupi dokumentu i da se preuzmu podaci koje je korisnik uneo i da se iskoriste na odgovarajući način.

Napomena 1:

Treba naglasiti da sva INPUT polja koja ćemo pominjati nisu uvek podržana od strane svih glavnih web pregledača.

Da biste proverili da li vaš web pregledač podržava neku HTML komponentu ili web tehnologiju, posetite link  https://caniuse.com  i ukucajte ime tražene kontrole/tehnologije.


Napomena 2:

U nastavku je link ka jednom online okruženju za vežbanje (html, css, javascript i pregled rezultata)


Last modified: Friday, 3 November 2023, 11:19 AM