Curs2_2014

5
PROGRAMARE INTERNET CURS 2 TAG-uri HTML pentru formulare și controale --- Formulare <form name="form1" action=" "> </form> --- Zona de editare <input name="text1" type="text" value=" "> Grup de butoane de opțiune <input type="radio" name="RadioGroup1 " value="a" checked>a<BR> <input type="radio" name="RadioGroup1 " value="b">b<BR> <input type="radio" name="RadioGroup1 " value="c">c<BR> Obs: În cazul unui grup de butoane de opțiune, toate elementele au același nume . Elementele sunt indexate implicit de la 0, în ordinea în care apar. checked- elementul care va fi selectat ---- Căsuță de validare <input name="checkbox" type="checkbox" value="selectat" checked>selectat<br> ---- Listă derulantă <select name="select"> <option value="a" selected>a</option> <option value="b">b</option> <option value="c">c</option> 1

description

Programare Internet

Transcript of Curs2_2014

Page 1: Curs2_2014

PROGRAMARE INTERNETCURS 2

TAG-uri HTML pentru formulare și controale

---Formulare<form name="form1" action=" ">

</form>

---Zona de editare<input name="text1" type="text" value=" ">

Grup de butoane de opțiune <input type="radio" name="RadioGroup1" value="a" checked>a<BR> <input type="radio" name="RadioGroup1" value="b">b<BR> <input type="radio" name="RadioGroup1" value="c">c<BR> Obs: În cazul unui grup de butoane de opțiune, toate elementele au același nume. Elementele sunt indexate implicit de la 0, în ordinea în care apar.

checked- elementul care va fi selectat

----Căsuță de validare

<input name="checkbox" type="checkbox" value="selectat" checked>selectat<br>

----Listă derulantă

<select name="select"> <option value="a" selected>a</option> <option value="b">b</option> <option value="c">c</option> </select>

----Butoane de comandă

<input name="button1" type="button" value="inregistrare" onClick="inreg()">

Într-un script JavaScript, se vor utiliza:

1

Page 2: Curs2_2014

form1.text1.value – pentru valoarea (textul) din zona de editare

form1.RadioGroup1[0].checked - pentru a determina butonul de opțiune selectatform1.RadioGroup1[1].checkedform1.RadioGroup1[2].checked

form1.RadioGroup1[0].value -pentru a citi valoarea butonului de opțiune

form1.RadioGroup1[0].checked=true - pentru a selecta primul buton de opțiune

form1.checkbox.checked -pentru a determina dacă a fost selectată căsuța de validare

form1.checkbox.value -pentru a citi valoarea căsuței de validare

form1.checkbox.checked=true - pentru a selecta căsuța de validareform1.checkbox.checked=false - pentru a deselecta căsuța de validare

form1.select.options[0].selected - pentru a determina elementul selectatform1.select.options[1].selectedform1.select.options[2].selected

form1.select.options[0].value -pentru a citi valoarea unui element

form1.select.options[0].selected=true -pentru a selecta elemental cu indicele 0

APLICAŢII CU FORMULARE ŞI CONTROALE HTML

Aplicaţia 1Pentru un număr variabil de studenţi, se introduc datele următoare:

-numele, prenumele (zonă de editare);-anul (butoane de opţiune);-bursa (căsuţă de validare);- specializarea (listă derulantă).

Toate datele vor fi afişate într-o tabelă HTML.

<html><head><title> Titlul paginii -- Titre de la page</title></head><script language="JavaScript">nume=[]; prenume=[]; bursa=[]; anul=[]; specializarea=[];i=0;function inreg(){

2

Page 3: Curs2_2014

nume[i]=form1.text1.value;form1.text1.value="";

prenume[i]=form1.text2.value;form1.text2.value="";

for(j=0;j<=2;j++)if(form1.RadioGroup1[j].checked) anul[i]=form1.RadioGroup1[j].value;

form1.RadioGroup1[0].checked=true;

if(form1.checkbox1.checked) bursa[i]="da";

elsebursa[i]="nu";

form1.checkbox1.checked=true;

for(j=0;j<=2;j++)if(form1.select1.options[j].selected) specializarea[i]= form1.select1.options[j].value;

form1.select1.options[0].selected=true;i+=1;

}

function afis(){

document.write("<table border=1>")document.write("<tr><td>Numele</td><td>Prenumele</td><td>Anul</td><td>Specializarea</td><td>Bursa</td></tr>");for(i=0;i<nume.length; i++)

document.write("<tr><td>"+nume[i]+"</td><td>"+prenume[i]+"</td><td>"+anul[i]+"</td><td>"+specializarea[i]+"</td><td>" +bursa[i]+"</td></tr>");

document.write("</table>");}</script>

<body>

<form name="form1" action="">

Nume---Nom <input type="text" name="text1" value=""><br>Prenume---Prenom <input type="text" name="text2" value=""><br>

<br>Anul de studiu -- L'annee d'etude<br>

3

Page 4: Curs2_2014

<input type="radio" name="RadioGroup1" value="anul 1" checked>anul 1 <br><input type="radio" name="RadioGroup1" value="anul 2" >anul 2 <br><input type="radio" name="RadioGroup1" value="anul 3" >anul 3 <br>

<br><hr><input type="checkbox" name="checkbox1" value="da" checked>bursa--bourse<br>

<br><select name="select1"><option value="IE" selected>IE</option><option value="CIG">CIG</option><option value="FB">FB</option></select>

<br><input type="button" name="button1" value="inregistrare--enregistrement" onClick="inreg()"><input type="button" name="button2" value="afisare -- afficher" onClick="afis()"></form></body></html>

4