verificare completare select-uri

[sterica]

Salutare,

Am o pagina web care incarca aprox 300 de selecturi, cum pot face ca atunci cand se apasa butonul de trimite a valorior din selecturi sa ma atentioneze daca este vreun select necompletat si bineinteles valorile sa nu fie trimise in sql daca nu sunt completate toate.

Multumesc!

Salut
Pune "required" la select-urile (si alte elemente de formular) care trebuie completate; - indica faptul ca respectivul camp trebuie sa fie completat inainte de a trimite datele.
Poate fi suficient cu acest atribut.

Cod: Selectaţi tot

<form action="#" method="post" id="frm1">
Sel1: <select name="sl1" required>
<option value="">Select</option>
<option value="s1v1">s1v1</option>
<option value="s1v2">s1v2</option>
</select><br>
Text: <input type="text" /><br>
Sel2: <select name="sl2"required>
<option value="">Select</option>
<option value="s2v1">s2v1</option>
<option value="s2v2">s2v2</option>
</select><br>
<input type="submit" id="sbmt1" value="Send"  />
</form>

- Demo:

Sel1: Selects1v1s1v2
Text:
Sel2: Selects2v1s2v2

Sau mai complex, acest script cu javascript [ca fapt divers, dar nu mai e necesar[ (pune "disable" la butonul submit, deci si la trimiterea formularului, daca nu sunt completate toate <select>-urile):

Cod: Selectaţi tot

- Complete all the select elements.
<form action="#" method="post" id="frm1">
Sel1: <select name="sl1" required>
<option value="">Select</option>
<option value="s1v1">s1v1</option>
<option value="s1v2">s1v2</option>
</select><br>
Sel2: <select name="sl2"required>
<option value="">Select</option>
<option value="s2v1">s2v1</option>
<option value="s2v2">s2v2</option>
</select><br>
Text: <input type="text" /><br>
Sel3: <select name="sl3"required>
<option value="">Select</option>
<option value="s3v1">s3v1</option>
<option value="s3v2">s3v2</option>
</select><br>
<input type="submit" id="sbmt1" value="Send" disabled />
</form>

<script>
//function for object to check if all the <select>s in form are selected
//receives the for id (fid), and id of the submit button (sid)
//it works if the first <option> in each <select> is not a valid value for submission
function checkAllSelect(fid, sid){
  var form = document.getElementById(fid);
  var scls = form.querySelectorAll('select'); //get all selects in this form
  var sid = document.getElementById(sid);  //submit button

  //if all the $scls have option selected, removes disabled of $sid
  function chkScls(){
    var re = true;
    for(var i=0; i<scls.length; i++){
      //if no option selected, other that first option
      if(scls[i].selectedIndex ==0){
        sid.setAttribute('disabled', 'disabled');
        re = false;
        break;
      }
    }
    if(re ==true) sid.removeAttribute('disabled');
    return re;
  }

  //register chkScls() to change event to each select
  for(var i=0; i<scls.length; i++) scls[i].addEventListener('change', chkScls);

  //when form is submited, if chkScls() returns false, alert msg
  form.addEventListener('submit', function(){
    if(chkScls() ==false) alert('Coplete all <select>s');
  });
}

//create instance object of the checkAllSelect to use it with for #frm1
var sfrm1 = new checkAllSelect('frm1', 'sbmt1');
</script>

Demo:

- Complete all the select elements.

Sel1: Selects1v1s1v2
Sel2: Selects2v1s2v2
Text:
Sel3: Selects3v1s3v2

multumesc mult, foarte usor cu "required"