JS验证是否选择了下拉值

Question

I am trying to write a validation block inside my JS to check if the user has selected a value or not and pop up a message if the value is not selected.

function validate(form) {
    var success = true;
    var message = "";

    if (form.dropdown.selectedIndex ==  0 )  {  
        form.save.disabled=true;

        if (0 < message.length) {
            message += "\n"; 
        }
        message += "dropdown  value should be selected.";
    }

    if (0 < message.length) {
        alert(message);
        success = false;
    }

    return success;
}

When I click on Save button I call this function. I don't see errors in the logs. Can anyone tell me what am I doing wrongly here? Or can you guide me what is the correct method to validate if the user has selected a value before allowing to save?

Thanks!

Answer 1

If no option is selected, the select element's selectedIndex will be -1 . It's recommended that one option is always set to selected , that way you know what the default selected option is (user agents may make the first option selected by default if you don't).

So the test:

if (form.dropdown.selectedIndex ==  0 )  {  

will only be true if the first option has the selected attribute. So either test against -1 or make the first option selected by default, eg

<select name="dropdown" ...>
  <option selected value="default">Please select an option
  ...
</select>