Angularjs ng-pattern missbehaviour with regex

Question

I have the following html with angularJs :

<input id="subjectCode"
                       name="subjectCode"
                       class="form-control input-md"
                       required
                       type="text"
                       ng-model="subjectCode"
                       ng-minlength="3"
                       ng-pattern="/^[A-Z0-9]+$/i">

The above code validate the text input versus minimum 3 characters that should be either AZ capital letters or digits 0-9. This is validated to show error and set css to highlight mismatch as following:

<div class="form-group"
             ng-class="{ 'has-error':
                            myform.subjectCode.$invalid
                             && fahrasform.subjectCode.$dirty,
                        'has-success':
                            !myform.subjectCode.$invalid
                            && fahrasform.subjectCode.$dirty }">

The problem is that angularjs does not set $invalid to true if I use small letters while it sets it to false for other cases like entering international letters or special characters.

So, any suggestions?

Answer 1

replace with this code:

<input id="subjectCode"
                       name="subjectCode"
                       class="form-control input-md"
                       required
                       type="text"
                       ng-model="subjectCode"
                       ng-minlength="3"
                       ng-pattern="/^[A-Z0-9]*$/">

ng-pattern="/^[A-Z0-9]+$/i" in this regular expression /i Perform case-insensitive matching.that's you have done mistake