I have a list box and want to limit the user to selecting a max of 5 items from the list. I've put in a counter which warns the user that more than 5 items have been selected, however I cannot reverse the users selection of the last item in the select box as I cannot identify which of the items was the last. I store the list of selected items in a hidden field on change. That one is no problem, but I want to reflect which items have been selected.
The options shown are just examples, the actual list is much longer. It would be nice if I could identify the current selection. Right now I only see one option and that is to repopulate the options array making selected items by what is found in the hidden field.
The options shown are just examples, the actual list is much longer. It would be nice if I could identify the current selection. Right now I only see one option and that is to repopulate the options array making selected items by what is found in the hidden field.
Code:
<SELECT NAME="rDEPT" id ="rDEPT" multiple class="InputText" onChange="assembleDept(this);" > <option value="-1" SELECTED>Select Pay Type</option> <option value="A">Annual</option> <option value="B">Bi-Weekly</option> <option value="C">Contract</option> <option value="H">Hourly</option> <option value="P">Part-Time</option> <option value="S">Salaried</option> </select> function assembleDept(obj) { //need to alert if more than 5 items selected var cNewVal = "" var cCount = 0 for(i=0;i<document.getElementById("rDEPT").options.length;i++) { if (document.getElementById("rDEPT").options[i].selected ) { cCount += 1; if (cCount > 5) { alert("you have selected more than 5 departments"); }else{ cNewVal += document.getElementById("rDEPT").options[i].value.substring(0,6)+"~"; } } } document.getElementById("REVIEWDEPT").value = cNewVal }
Comment