how to convert characters into uppercase when typing with ng-pattern of PAN?

[SEKAR RAJ]

the following input box is accepting lowercase and display error message when PAN Number is invalid.

But the requirement is when typing pan number, it should convert lowercase into uppercase.

ng-pattern="/[A-Z]{5}\d{4}[A-Z]{1}/i"  is not allowing the text to convert uppercase.

so how to convert characters into uppercase when typing with ng-pattern?

                     <div class="col-sm-3">

                                <div class="form-group" ng-class="{'has-error' : userForm1.panNo.$invalid && (userForm1.panNo.$dirty || submitted)}">

                                <label for="">PAN<span style="color:red">*</span></label>

                                    <div class="input-group">

                                        <span class="input-group-addon"> <i class="glyphicon glyphicon-sort-by-order"></i></span>

                                       <input style="font-weight:normal;" type="text" id="" name="panNo" class="form-control" ng-model=""   ng-pattern="/[A-Z]{5}\d{4}[A-Z]{1}/i"  maxlength="10" placeholder="Enter PAN Number" required />

</div>

<p ng-show="userForm1.panNo.$error.required && (userForm1.panNo.$dirty || submitted)" class="help-block">Please Enter PAN Number</p>

<p ng-show="userForm1.panNo.$error.pattern && (userForm1.panNo.$dirty || submitted)" class="help-block">PAN No. Should be only numbers and Uppercase Letters.</p>

</div>

</div>

    

[Sander Elias]

Hi Sekar,

You can do that in a custom validator, although semantically that is not sound. Can't you just allow lower case and convert the whole thing to upper on blur?

Regards

Sander