Max Lynn Max Lynn - 6 months ago 33
Javascript Question

Angular.JS - only allow up to a certain number value in an input number field

I'm trying to understand a way with angular where I can only let the user enter a number that isn't more than 24 or in my other input 60 to represent hours and minutes.

<input type="number"
placeholder="HH"
ng-minlength="2"
ng-maxlength="2"
required
ng-model="session.timeHH">

<input type="number"
placeholder="mm"
ng-minlength="2"
required
ng-maxlength="2"
ng-model="session.timeMM">


This is my HTML at the moment.

The user can enter in the hours input a number like 99 which is obviously going to be wrong. I'm looking for a way to validate or prevent the user before submit to only be able to enter numbers up to 24 for hours and 59 for minutes.

Or even on the click of the submit button would be sufficient.

Answer

Not angular, but why not use the HTML attributes? Angular is hip to these and you can check the $valid property of the form to make sure the constraints are satisfied.

<input type="number" min="0" max="24" step="1">