restrict and input text to a specific language characters in angular.js

Question

i am building a form using angular.js.

my form looks like:

<form name="registerForm" class="form-horizontal">
    <div class="control-group">
        <label class="control-label">שם פרטי</label>
        <div class="controls">
            <input type="text" ng-model="register.firstName" placeholder="שם פרטי" required>
        </div>
    </div>
    <div class="control-group">
        <label class="control-label">שם משפחה</label>
        <div class="controls">
            <input type="text" ng-model="register.username" placeholder="שם משפחה">
        </div>
    </div>
    <div class="control-group">
        <label class="control-label">דוא"ל</label>
        <div class="controls">
            <input type="email" ng-model="register.email" placeholder='דוא"ל'>
        </div>
    </div>
</form>

i am building a register form inside i will have 2 fields: first name and last name that should be entered only with a specific language (not english). explanation: no other language except that language will be accepted by the form.

all other fields will have to be in english.

thanks

Modified @zsong answer to Hebrew/English/Arabic validation (without english numbers) - Enjoy: http://jsfiddle.net/yossico/3hefL0yp/ — yossico, Dec 04 '16 at 13:53

score 7 · Accepted Answer · answered Aug 16 '13 at 19:03

7

This is a good question.

You can check the Unicode block for this language here, I guess it is Hebrew, so the code range is 0590-05FF.

Then you can use ngPattern to do the validation like this:

<input type="text" name="firstName" ng-model="register.firstName" placeholder="שם פרטי" required ng-pattern="pattern"></div>

function ctrl($scope) {
    $scope.pattern = /[\u0590-\u05FF]+/g;
}

Here is the demo

answered Aug 16 '13 at 19:03

zs2020

53,766
29
154
219

The angular docs warn against using the 'g' flag in ng-pattern because it will not begin at the start of the string on successive searches. Also, this regex gives incorrect validation results if you mix latin chars with Hebrew chars in the demo link in @zsong's answer. The correct regex is as below so it only matches the unicode range from beginning to end without regard to lettercase and without the global flag, I forked the demo and linked it. `$scope.pattern = /^[\u0590-\u05FF]+$/i;` [Forked Demo from Answer](http://jsfiddle.net/taamrard/) – s9tpepper Oct 09 '15 at 02:41

score 0 · Answer 2 · edited May 23 '17 at 10:29

I think Regex is the way to go.

HTML5 has the new pattern attribute that you could use to validate the user input, the only problem is that you also have to take care of browsers that do not support it, with Angular you can use the ngPattern directive.

This question will help you with the regex.

Remember that this is just the front-end validation and I recommend you to validate the user input in the back-end as well.

restrict and input text to a specific language characters in angular.js

2 Answers2

Linked