dropdownlist驗證（必需）AngularJS

我在模型彈出窗口中有下拉列表，並且希望在此處進行必要的字段驗證。我的代碼如下..但代碼沒有做驗證..dropdownlist驗證（必需）AngularJS

<div class="form-group form-group-sm"> 
     <label for="itClassification" class="control-label text-xs 
     col-xs-12 col-sm-4 col-md-4 col-lg-4">IT Classification : 
     </label> 
     <div class="col-xs-12 col-sm-8 col-md-8 col-lg-8"> 
      <select class="form-control" id="itClassification" 
       name="itClassification" ng-model="itClassification" 
       ng-options="ic.itId as ic.itClassificationName for ic in 
       itClassifications" placeholder="select IT Classification" 
       required> 
       <option value="" ng-selected="selected">Select IT 
       Classification</option> 
      </select> 
      <div class="help-block" ng-messages="addClientModal.itClassification.$error" 
       ng-if="addClientModal.itClassification.$dirty && addClientModal.itClassification.$invalid"> 
      <p class="text-danger small" ng-message="required"><strong>ITClassification is required.</strong> 
      </p> 
     </div> 
    </div> 
</div>

任何人都可以幫我解決這個..？在此先感謝

來源

2016-08-23 KaviSuja

只需添加ngform標籤

<div class="form-group form-group-sm"> 
    <ng-form name="addClientModal"> 
    // other tags 
    </ng-form> 
</div>

在這裏，我補充形式的名稱作爲addClientModal看到Example

來源

2016-08-23 07:49:14

檢查這就是答案。您需要在表單名稱 - >表單控件名稱上使用驗證。這裏是Plunkr http://plnkr.co/edit/bKEVv4kfnSJFd0w29Zdl?p=preview

var app = angular.module('myApp', ['ngMessages']); 
 

 
app.controller('TestController', function($scope) { 
 

 
    //$scope.itClassification = null; 
 
    $scope.optionsList = [ 
 
    {'label':'One','value':'1'}, 
 
    {'label':'Two','value':'2'}, 
 
    {'label':'Three','value':'3'}, 
 
    {'label':'Four','value':'4'}, 
 
    {'label':'Five','value':'5'}, 
 
    {'label':'Six','value':'6'}, 
 
    {'label':'Seven','value':'7'}, 
 
    {'label':'Eight','value':'8'}, 
 
    {'label':'Nine','value':'9'}, 
 
    {'label':'Ten','value':'10'}, 
 
    ] 
 
    
 
    $scope.listItemChanged=function(schedule){ 
 
    alert($scope.itClassification) 
 
    }; 
 

 
});

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <script data-require="[email protected]" data-semver="1.5.0" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.2/angular.js"></script> 
 
    <script data-require="[email protected]*" data-semver="1.3.16" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.16/angular-messages.min.js"></script> 
 
    <link rel="stylesheet" href="style.css" /> 
 
    <script src="script.js"></script> 
 
</head> 
 

 
<body ng-app="myApp"> 
 
    <div ng-controller="TestController"> 
 
    <form name="userForm" autocomplete="off"> 
 
     <div class="form-group form-group-sm"> 
 
     <label for="itClassification" class="control-label text-xs col-xs-12 col-sm-4 col-md-4 col-lg-4">IT Classification :</label> 
 
     <div class="col-xs-12 col-sm-8 col-md-8 col-lg-8"> 
 
      <select class="form-control" id="itClassification" name="itClassification" ng-model="itClassification" ng-options="listItem.label as listItem.value for listItem in optionsList" placeholder="select IT Classification" required> 
 
      <option value="" ng-selected="selected">Select IT Classification</option> 
 
      </select> 
 
      <div class="help-block" ng-messages="userForm.itClassification.$error"> 
 
      <p class="text-danger small" ng-message="required"><strong>ITClassification is required.</strong> 
 
      </p> 
 
      </div> 
 
     </div> 
 
     </div> 
 
    </form> 
 
    </div> 
 
</body> 
 

 
</html>

來源

2016-08-23 08:07:44

dropdownlist驗證（必需）AngularJS

回答

相關問題