Angular - only input text in input type="text"

Question

So I have an input with the type text:

    <div class="row">
        <div class="form-group">
            <input type="text" class="form-control col-sm-12" id="last-name-reservation-form" placeholder="Last name" required>
        </div>
    </div>

How would I be able to filter on the input characters, such that it only takes text and not numbers? Sort of similar to how type="number" only allows numbers to be input.

Do I have to make something in the controller or can it be done directly in the .html?

Sajeetharan · Accepted Answer · 2017-01-09 17:16:31Z

2

You can just use ng-pattern

For restricting only alphabets,

<input type="text" ng-model="myText" name="inputName" ng-pattern="/^[a-zA-Z]*$/" >

For restricting only numbers,

<input type="text"  ng-model="myText" name="inputName" ng-pattern="/^\d+$/">

edited Jan 9, 2017 at 17:16

answered Jan 9, 2017 at 17:10

Sajeetharan

223k65 gold badges370 silver badges409 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Khaine775 Over a year ago

Had no idea you could do it like that. Short and easy. Thanks!

Khaine775 Over a year ago

I plan to, but can only do 10mins after posting the question :)

Sajeetharan Over a year ago

i think its almost 12 minutes :P

Chakra Jamdagneya · Accepted Answer · 2017-01-09 17:19:37Z

0

You could put

pattern="[A-Za-z]+"

in the input tag to make the pattern match.

edited Jan 9, 2017 at 17:19

answered Jan 9, 2017 at 17:13

Chakra Jamdagneya

243 bronze badges

2 Comments

ssc-hrep3 Over a year ago

Why {28} and not * / +?

Chakra Jamdagneya Over a year ago

I was just giving an example but thanks I changed it to +.

Collectives™ on Stack Overflow

Angular - only input text in input type="text"

2 Answers 2

3 Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related