SagarVimal SagarVimal - 6 months ago 162
AngularJS Question

AngularJs : Set conditional min and max value for validation in number input field

I have created a web page which contains a form with two number input fields

field1
and
field2
. I'm doing the validation on these fields.
field1
has a
min
value 1 and
max
value 100000 but
field2
should have
min
value is
max
of
field1
or 1, anything which is greater and
max
is 100000. I tried to assign the
ng-model
of
field1
as
min
of
field2
but it not working.

<div class="row">
<div>
<input ng-model="priceminrange" name="priceminrange" type="number"
class="form-control" value="" placeholder="MinRange" min="1" max="100000">
<span ng-show="form.priceminrange.$error.number">The value is not a valid number</span>
<span ng-show="form.priceminrange.$error.min || form.priceminrange.$error.max">
The value must be in range 1 to 100000</span>
</div>
<div>
<input ng-model="pricemaxrange" name="pricemaxrange" type="number"
class="form-control" value="" placeholder="MaxRange" min={{priceminrange}} max="100000">
<span ng-show="form.pricemaxrange.$error.number">The value is not a valid number</span>
<span ng-show="form.pricemaxrange.$error.min || form.pricemaxrange.$error.max">
The value must be in range {{priceminrange}} to 100000</span>
form.pricemaxrange.$error = {{form.pricemaxrange.$error}}
</div>
</div>

Answer

Try this

On controller create scope.

$scope.priceminrange = 1;