2016-04-23 138 views
0

我有兩個輸入一個最小值,另一個最大值。
如何添加驗證以便最大限度地保留最小<?最小和最大驗證

<div class="form-group"> 
 
    <label class="control-label"> Montant minimum</label> 
 
    <input id="min" class="form-control" type="number" ng-model="type.minMontant" required/> 
 
</div> 
 

 
<div class="form-group"> 
 
    <label class="control-label"> Montant maximum</label> 
 
    <input id="max" class="form-control" type="number" ng-model="type.maxMontant" required/> 
 
</div>

,然後當我會盡量挑一個值,它必須在[最小值,最大值]

回答

1

不知道這是笏你想

如果你想驗證消息顯示,那麼你必須使用角度消息

<div ng-app> 
    <div class="form-group"> 
     <label class="control-label"> Montant minimum</label> 
     <input id="min" class="form-control" type="number" min="0" max="{{maxMontant}}" ng-model="minMontant" required/> 
    </div> 

    <div class="form-group"> 
     <label class="control-label"> Montant maximum</label> 
     <input id="max" class="form-control" type="number" max="10" ng-model="maxMontant" required/> 
    </div> 
</div> 
0

添加minmax attiribute(HTML5)

<div class="form-group"> 
    <label class="control-label"> Montant minimum</label> 
    <input id="min" class="form-control" type="number" ng-model="type.minMontant" min="0" required/> 
</div> 

<div class="form-group"> 
    <label class="control-label"> Montant maximum</label> 
    <input id="max" class="form-control" type="number" ng-model="type.maxMontant" max="10" required/> 
</div> 
0

您可以自定義驗證檢查的範圍的完整性,然後檢查可用範圍的輸入值。

下面是它的一個模擬:

JSFiddle

$scope.validate = function() { 
    var valid = $scope.validateMin() && $scope.validateMax(); 
    if (valid) { 
    if ($scope.type.value >= $scope.type.min && 
     $scope.type.value <= $scope.type.max) { 
     alert("Correct Value") 
    } else { 
     alert("Out of range"); 
    } 
    } else { 
    alert("Incorrent range values entered"); 
    } 
}