Input type number validation

Sushmit Sagar

I have input type number, I want to restrict it to only numbers between 1 and 2. It can accept numbers between 0.00001 and 2 with decimal places up to 5 and not 0.

How do i do it? And also the user must not be able to write anything else manually.

I have tried min="1" and max="2" attributes but user is still able to type 0 manually and form is being submitted.

My project is based on angular 5 and I am using a template driven form. Please do not suggest solutions for reactive forms.

khush

You can try regex also

If you want number in range of 1-2 with 5 decimals without number 2 then use pattern below,

[1]+(.[0-9]?[0-9]?[0-9]?[0-9]?[0-9]?)?

And if you want less than and equal to 2, you can set pattern as,

^(?:2|2.0|2.00|2.000|2.0000|2.00000 | (.[0]{1,2})?|([1])(.[0-9]?[0-9]?[0-9]?[0-9]?[0-9]?)?)$

For example:

<input class="form-control" 
           [(ngModel)]="data" name="dataModel" #dataModel="ngModel" required
           pattern="^(?:([2])(\.[0]*)? | (\.[0]{1,2})?|([1])(\.[0-9]?[0-9]?[0-9]?[0-9]?[0-9]?)?)$">
    <div *ngIf="dataModel.errors && (dataModel.dirty || dataModel.touched)">
      <small [hidden]="!dataModel.errors.required">
        Required
      </small>
      <small [hidden]="!dataModel.errors.pattern">
        pattern check
      </small>         
    </div>

And if you want in range of 0-2 including 2 then you can set pattern as,

^(?:2|2.0|2.00|2.000|2.0000|2.00000 | (.[0]{1,2})?|([0-1])(.[0-9]?[0-9]?[0-9]?[0-9]?[0-9]?)?)$

If you want in range of 0-2 excluding 0 then pattern can be (this pattern accepts from 0.00001 to 2.00000 numbers),

^(2|2.0|2.00|2.000|2.0000|2.00000|([1]+(.?[0-9]?[0-9]?[0-9]?[0-9]?[0-9]?){1}|[0]+(.[0-9]{0,4}[1-9]{1})))$

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

From Dev

input type = number validation in angularjs

From Dev

input type = number validation in angularjs

From Dev

Strangeness with Angular validation of input type="number"

From Dev

Preserving input value regardless of validation with input type="number"

From Dev

Preserving input value regardless of validation with input type="number"

From Dev

Social Security Number input validation

From Dev

Input Box Current number validation

From Dev

Input type ='file': validation not working

From Java

Styling a input type=number

From Dev

Input type number in AngularJS

From Dev

Batch File input validation integer number

From Dev

HTML Input Number, min validation error

From Dev

Strip Phone Number Input Before Validation in Rails

From Dev

Number input field loses focus on validation change

From Dev

angular validate input type="number"

From Dev

Using ngMessage for input type number

From Dev

checkValidity() of number input type in Dartlang

From Dev

input type number is returning null

From Dev

input type number and search combined

From Dev

alerting the value of an input type number

From Dev

Input EditText(Type:Number) into array[]

From Dev

Arrows not working on input type="number"

From Dev

Input type number, decimal value

From Dev

Using ngMessage for input type number

From Dev

multiplying input fields with type="number"

From Dev

alerting the value of an input type number

From Dev

setting steps for input type=number

From Dev

Change CSS of input number type based on input

From Dev

Change CSS of input number type based on input