In acest tutorial puteti invata cum sa verificati si sa validati butoane radio si checkbox cu JavaScript.
Ca sa verificati daca un buton radio, sau checkbox e bifat, se foloseste proprietatea checked.
Daca butonul e bifat, proprietatea JavaScript "checked" returneaza true, altfel returneaza false.

• Pentru a verifica /valilda daca un buton checkbox e bifat este simplu deoarece fiecare input checkbox trebuie sa aibe un nume unic.
Sintaxa:
if (formular.nume_checkbox.checked == false) alert('Butonul checkbox nu e bifat');

• Cand trebuie verificate butoane radio e poutin mai complicat, deoarece mai multe butoane radio au acelasi nume, astfel, JavaScript le retine intr-un array. Formula:
formular.buton_radio
- Returneaza un array cu toate butoanele radio cu name="buton_radio" din "formular".
Ca sa validati butoanele radio, trebuie parcurs acel array, si verificat fiecare element (fiecare buton), precum in codul urmator.
var radio_buttons = formular.buton_radio;
var re = false;

// parcurge array-ul cu butoanele radio, daca unul e bifat, face "re" true
for(var i=0; i<radio_buttons.length; i++) {
  if (radio_buttons[i] == true) {
     re = true;
  }
}

// daca "re" false, inseamna ca nici un buton radio nu e bifat
if(re == false) alert('Radio buton nu e bifat');

• Mai jos e un exemplu practic, cu un formular ce contine doua butoane radio si trei checkboxes. Utilizatorul trebuie sa bifeze un buton radio (leguma), si cel putin un checkbox (fructe), altfel, cand trimite formularul, functia checkButons() afiseaza mesaj de eroare si returneaza False.
<h4>Alegeti o leguma si cel putin un fruct</h4>
<form action="" method="post" name="f1" onsubmit="return checkButons(this);">
Legume: <input type="radio" name="leguma" value="varza" />Varza
 <input type="radio" name="leguma" value="morcov" />Morcov<br/>
Fructe:<br/>
 <input type="checkbox" name="fruct1" value="mar" />Mar<br/>
 <input type="checkbox" name="fruct2" value="para" />Para<br/>
 <input type="checkbox" name="fruct3" value="banana" />Banana<br/>
 <input type="submit" value="Trimite" />
</form>
<script type="text/javascript"><!--
// verifica butoane (radio, checkbox) - marplo.net
function checkButons(frm) {
var re = false;           // folosita pt a determina cand un buton e bifat
var err = '';             // retine erorile

var legume = frm.leguma;          // contine un array cu toate butoanele radio "leguma"

// creaza un Array in  format JSon cu butoanele checkbox
var fructe = [frm.fruct1, frm.fruct2, frm.fruct3];

// traverseaza array-ul cu radio
// daca unul e bifat, seteaza "re" true, si opreste parcurgerea cu "break"
for(var i=0; i<legume.length; i++) {
  if(legume[i].checked == true) {
    re = true;
    break;
  }
}

// daca "re" e false inseamna ca nici un buton radio nu e bifat, adauga eroare in "err" 
if(re == false) err += '- Trebuie sa alegeti o leguma';

// face iar "re" false si parcurge array-ul cu checkbox
// daca unul e bifat, seteaza "re" true, si opreste parcurgerea cu "break"
re = false
for(var i=0; i<fructe.length; i++) {
  if(fructe[i].checked == true) {
    re = true;
    break;
  }
}

// daca "re" e false inseamna ca nici un checkbox nu e bifat, adauga eroare in "err" 
if (re == false) err += '\n - Trebuie sa alegeti cel putin un fruct';

// daca "err" nu e gol, afiseaza erorile si returneaza False, oprind trimiterea formularului
if(err != "") {
  alert(err);
  return false;
}
else return re;
}
--></script>
Demo:

Alegeti o leguma si cel putin un fruct

Legume: Varza Morcov
Fructe:
Mar
Para
Banana

Un Test simplu in fiecare zi

HTML
CSS
JavaScript
PHP-MySQL
Engleza
Spaniola
Ce element HTML adauga continut flash SWF in pagina web?
<object> <div> <script>
<object type="application/x-shockwave-flash" data="file.swf" width="500" height="250">
 <param name="src" value="file.swf" />
 Browser-ul dv. nu suporta SWF.
</object>
Care pseudo-clasa CSS adauga un stil la un camp input de formular cand e cursorul in el?
:active :focus :hover
input:focus {
  background-color: #88fe88;
}
Clic pe instructiunea care transforma un sir JSON in obiect JavaScript.
JSON.stringify(javascript_object) object.toString() JSON.parse(json_string)
var jsnstr = '{"url": "http://coursesweb.net/", "title": "Web Development Courses"}';
var obj = JSON.parse(jsnstr);
alert(obj.url);
Indicati functia PHP care poate crea sau scrie un fisier pe server.
fopen() file_put_contents() file_get_contents()
if (file_put_contents("file.txt", "content")) echo "Fisierul a fost creat";
else echo "Fisierul nu poate fi creat";
Cum se spune "al treilea" in engleza?
threeth third three
I planted the third tree.
- Am plantat al treilea pom.
Cum se spune "al treilea" in spaniola?
segundo tres tercero
Yo planté el tercero árbol.
- Am plantat al treilea pom.
Verificare, Validare butoane radio si checkbox cu JavaScript

Last accessed pages

  1. Creare si editare pagini HTML (31407)
  2. Jokes - Glume, Bancuri, Humor (2) (3121)
  3. Numerale, Numere in limba engleza - Numerals (25190)
  4. Subtantive - Plural (2165)
  5. Verbe neregulate din limba Engleza (8889)

Popular pages this month

  1. Gramatica limbii engleze - Prezentare Generala (1976)
  2. Prezentul simplu si continuu - Present Tense Simple and Continuous (1677)
  3. Trecutul simplu si continuu - Past Tense Simple and Continuous (1575)
  4. Prezent perfect si Prezent perfect continuu - Present perfect and Continuous (1434)
  5. Conditional IF in Limba Engleza - Fraze Conditionale (1167)