AngularJS Dropdown required validation AngularJS Dropdown required validation asp.net asp.net

AngularJS Dropdown required validation


You need to add a name attribute to your dropdown list, then you need to add a required attribute, and then you can reference the error using myForm.[input name].$error.required:

HTML:

        <form name="myForm" ng-controller="Ctrl" ng-submit="save(myForm)" novalidate>        <input type="text" name="txtServiceName" ng-model="ServiceName" required><span ng-show="myForm.txtServiceName.$error.required">Enter Service Name</span><br/>          <select name="service_id" class="Sitedropdown" style="width: 220px;"                            ng-model="ServiceID"                   ng-options="service.ServiceID as service.ServiceName for service in services"                  required>             <option value="">Select Service</option>           </select>           <span ng-show="myForm.service_id.$error.required">Select service</span>        </form>    Controller:        function Ctrl($scope) {          $scope.services = [            {ServiceID: 1, ServiceName: 'Service1'},            {ServiceID: 2, ServiceName: 'Service2'},            {ServiceID: 3, ServiceName: 'Service3'}          ];    $scope.save = function(myForm) {    console.log('Selected Value: '+ myForm.service_id.$modelValue);    alert('Data Saved! without validate');    };        }

Here's a working plunker.