how to allow only alphabets in input box with angular js

Question

I have a input box with angular js validation.. The code is

    <div class="col-sm-12">
        <input type="text" name="drug_name" class="form-control" placeholder="Drug name" ng-pattern="/[aA-zZ\s]$/" ng-model="vmp.medication.drug_name" maxlength="150" typeahead="drugn as drugn.drugName for drugn in vmp.drugList | filter:$viewValue" autocomplete="off"  required>
<span class="pull-right font-10">(Max 150 chars.)</span>
  <span ng-messages="form.drug_name.$dirty && form.drug_name.$error">
   <span ng-message="required" class="error-inner">Drug name is required.</span>
   <span ng-message="pattern" class="error-icn">Only Alphabets are allowed</span> </span>
     </div>

The above code is validating the textbox and throwing error if I enter numbers. But What I need is , It should restrict entering numbers. The user should not be able to enter numbers in the textbox at all.. Can anyone helpme to do this..

Possible duplicate of Limited to write only a-z in angular

hsz
– hsz

2016-03-11 10:59:15 +00:00
Commented Mar 11, 2016 at 10:59 — hsz
– hsz, Commented Mar 11, 2016 at 10:59
Possible duplicate of Validation on text on alphabets enter

Sandeep Sukhija
– Sandeep Sukhija

2016-03-11 11:05:30 +00:00
Commented Mar 11, 2016 at 11:05 — Sandeep Sukhija
– Sandeep Sukhija, Commented Mar 11, 2016 at 11:05

alexey · Accepted Answer · 2016-03-11 11:07:59Z

3

Here is what you are looking for ng-pattern-restrict. In your case should looks like:

<input type="text" pattern="[a-zA-Z]+" ng-pattern-restrict />

answered Mar 11, 2016 at 11:07

alexey

1,41112 silver badges20 bronze badges

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

Comments

Jason · Accepted Answer · 2016-03-12 06:10:11Z

0

app.directive('name', function() {
  return {
    require: 'ngModel',
    link: function (scope, element, attr, ngModelCtrl) {
      function fromUser(text) {
        var transformedInput = text.replace(/[^A-Za-z ]/g, '');
        console.log(transformedInput);
        if(transformedInput !== text) {
            ngModelCtrl.$setViewValue(transformedInput);
            ngModelCtrl.$render();
        }
        return transformedInput;
      }
      ngModelCtrl.$parsers.push(fromUser);
    }
  }; 
});

This won't allow digit input.

edited Mar 12, 2016 at 6:10

Jason

2,3042 gold badges19 silver badges25 bronze badges

answered Mar 12, 2016 at 5:51

viral

33 bronze badges

Collectives™ on Stack Overflow

how to allow only alphabets in input box with angular js

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related