如何防止插入值大于用户在文本字段中输入的数字

Question

I had a text field called premium where the user can enter max of 10 digits.After they click submit another text field called deposit opens where it can enter a max of 7 digits..But I want to give a condition where the user cant enter the deposit more than premium.. Example:

If premium=111 Deposit should be <=111

If the deposit is more than premium onchange the value should be changed back to premium ie, to 111

Can someone help me in this I got stuck. Thanks. Jsfiddle for above: https://jsfiddle.net/U3pVM/28556/

Answer 1

Kindly check once and upvote if you find it helpful

https://jsfiddle.net/U3pVM/28558/

             function TodoCtrl($scope) {

                $scope.hide=false;
                $scope.submit = function() {
                   $scope.hide=true;
                   if($scope.deposit && parseInt($scope.deposit)>parseInt($scope.premium)){

                     $scope.deposit = $scope.premium;
                  }
               };

             }

Answer 2

hi you can add tyr with following code as a attribute to deposit input field. And give id "preminum" to premium input field.

onkeypress="return Number(this.value()+""+event.key) <= Number($('#premium').value());"

This won't allow user to enter value more than premium.

Answer 3

Add this code:

$scope.$watch('deposit', function(newVal, oldVal){     
    if(newVal && newVal*1 > $scope.premium*1)
        $scope.deposit = $scope.premium;    
})

Answer 4

Html5 supports min and max with number inputs. For example: <input type="number" name="deposit" min="1" max="111"> Anyway it is good to check all user inputs on server side.