enkryptor enkryptor - 5 months ago 30
AngularJS Question

"Required" validation doesn't work in <select> with default value

I have a required


<select name="service_id" class="Sitedropdown" style="width: 220px;"
ng-options="service.ServiceID as service.ServiceName for service in services"
<option value="">Select Service</option>

When it is empty, the form should display a "Select service" error message. Here's a working plunker.

It works fine when you intentionally selects the empty option. But when you reload the page, the
is empty by default and there is no validation. How to make AngularJS validate the default value?


Your code:

ng-show="myForm.service_id.$dirty && myForm.service_id.$invalid"

This means - if value is dirty (was changed) and is invalid. Remove first and you'll get what you want.