値が別のフィールドと同じである場合、フィールド上の角度フォームの検証

「First Reviewer」と「Second Reviewer」という2つのドロップダウンがあります。ユーザーが最初のドロップダウンと同じ値、つまり「First Reviewer」を選択した場合、ドロップダウンの「Second Reviewer」を検証したいと思います。 angularjsでどうすればいいですか？以下は値が別のフィールドと同じである場合、フィールド上の角度フォームの検証

コードスニペットです：ここで

\t <div class="row-fluid"> \t 
 
\t \t <div dyna-span="5,6"> 
 
\t \t \t <bs-control-group label="Review Level:"> 
 
\t \t \t \t <label class="radio inline"> <input type="radio" 
 
\t \t \t \t \t name="userTypeId" ng-model="reimbReviewer.reviewLevel" value="1" 
 
\t \t \t \t \t class="inline" />&nbsp;One Level 
 
\t \t \t \t </label> <label class="radio inline"> <input type="radio" 
 
\t \t \t \t \t name="userTypeId" ng-model="reimbReviewer.reviewLevel" value="2">&nbsp;Two Level 
 
\t \t \t \t </label> 
 
\t \t \t </bs-control-group> 
 
\t \t \t <bs-control-group label="First Reviewer"> <select 
 
\t \t \t \t \t \t \t \t class="input-medium" ui-select2 name="firstReviewer" 
 
\t \t \t \t \t \t \t \t ng-model="reimbReviewer.firstReviewer" gt-input-msg 
 
\t \t \t \t \t \t \t \t gt-error-msgs="gtinputerrormsgs" required> 
 
\t \t \t \t \t \t \t \t <option value="">----Select----</option> 
 
\t \t \t \t \t \t \t \t <option ng-repeat="a in reviewerTypes" value={{a.id}}>{{a.title}}</option> 
 
\t \t \t </select> </bs-control-group> 
 
\t \t \t <span ng-show="reimbReviewer.reviewLevel==2"> 
 
\t \t \t \t <bs-control-group label="Second Reviewer"> <select 
 
\t \t \t \t \t \t \t \t \t class="input-medium" ui-select2 name="secondReviewer" 
 
\t \t \t \t \t \t \t \t \t ng-model="reimbReviewer.secondReviewer" gt-input-msg 
 
\t \t \t \t \t \t \t \t \t gt-error-msgs="gtinputerrormsgs" ng-required="reimbReviewer.reviewLevel==2"> 
 
\t \t \t \t \t \t \t \t \t <option value="">----Select----</option> 
 
\t \t \t \t \t \t \t \t \t <option ng-repeat="a in reviewerTypes" value={{a.id}}>{{a.title}}</option> 
 
\t \t \t \t \t \t \t \t </select> </bs-control-group> 
 
\t \t  </span> 
 
\t \t </div> 
 
\t </div>

出典

2017-01-10 code chimp

を持っている場合は、それらを比較しているあなたのNG-モデルを初期化したら、あなたは我々が – acostela

に私を助けることができるようにしようとしているものとのいくつかのコードを追加してください。 –

@ code-chimp最初のフィルタの選択値を2番目のドロップダウンに表示したくない場合は、angularjsフィルタを使用できます。 – user3542450

は、作業のデモです。

// the main (app) module 
 
var app = angular.module("myApp", []); 
 

 
// add a controller 
 
app.controller("myCtrl", function($scope) { 
 
    //debugger; 
 
    $scope.msg = ""; 
 
    $scope.reimbReviewer = {}; 
 
    $scope.reviewerTypes = [ 
 
     { 
 
\t \t id: 1, 
 
     title: 'A' 
 
     }, 
 
     { 
 
     \t id:2, 
 
     title: 'B' 
 
     }, 
 
     { 
 
     \t id: 3, 
 
     title: 'C' 
 
     } 
 
    ]; 
 
    
 
    $scope.submit = function() { 
 
    \t debugger; 
 
    \t if($scope.dropdownForm.$invalid) { 
 
    \t $scope.msg = "Fields are required"; 
 
     \t //console.log('Fields are required'); 
 
     return; 
 
     } 
 
    \t if($scope.reimbReviewer.firstReviewer === $scope.reimbReviewer.secondReviewer) { 
 
    \t \t \t 
 
     //console.log('Fileds must be different'); 
 
     $scope.msg = "Fileds must be different"; 
 
     return; 
 
     } else { 
 
     $scope.msg = "Both are different. Do your stuff"; 
 
     \t //console.log('Both are different. Do your stuff'); 
 
     } 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<!DOCTYPE html> 
 
<html> 
 

 
    <head> 
 
    </head> 
 

 
    <body ng-app="myApp" ng-controller="myCtrl" style="margin:20px"> 
 
    <form name="dropdownForm"> 
 
     <select name="firstReviewer" ng-model="reimbReviewer.firstReviewer" required> 
 
     <option value="">----first----</option> 
 
     <option ng-repeat="a in reviewerTypes" value="{{a.id}}"> 
 
      {{a.title}} 
 
     </option> 
 
     </select> 
 
     
 
     <select name="secondReviewer" ng-model="reimbReviewer.secondReviewer" required> 
 
     <option value="">----second----</option> 
 
     <option ng-repeat="a in reviewerTypes" value="{{a.id}}"> 
 
      {{a.title}} 
 
     </option> 
 
     </select> 
 
     <button type="button" ng-click="submit()">submit</button> <br /> 
 
     <p ng-if="msg">{{msg}}</p> 
 
    </form> 
 
    </body> 
 

 
</html>

あなたは、彼らが同じ値か

出典

2017-01-10 13:21:04 nivas

あなたの答えはありがたいですが、角度jsのライブ検証ではintrestedでしたが、サブミットボタン –

を押す必要はありませんあなたの入力モデルで '$ scope.watch'関数を使い、検証エラーやトースターメッセージを投げることはあなたの必要に応じて良いでしょう。私はあなたがそれを行う方法を知っていればいいと思う。 – nivas

値が別のフィールドと同じである場合、フィールド上の角度フォームの検証

答えて

関連する問題