Text box should accept both English and Arabic characters using regular expressions

Question

I need to create regular expression that should accept both English and Arabic letters. How can I do this?

HTML:

<input type="text" class="ico1" name="firstname" id="firstname" placeholder="enter name " title="enter name ">

JS:

$("#register-form").validate({
  rules: {
    firstname: {
      required: true,
      minlength: 2,
      regx: /^[a-zA-Z-,]+(\s{0,1}[a-zA-Z-, ])*$/
    },
  },
  messages: {
    firstname: {
      required: "<font color='red'>  please enter name </font>",
      minlength: "<font color='red'>minimum length is 2</font>",
      regx: "<font color='red'>enter only english or arabic letters</font>"
    }
  },
  submitHandler: function(form) {
    form.submit();
  }
});

Could you please share a working fiddle and a test string? – Wiktor Stribiżew Apr 29 '16 at 07:15 — Wiktor Stribiżew, Apr 29 '16 at 07:15
There is no `regx` property. Where does it come from? – Wiktor Stribiżew Apr 29 '16 at 08:05 — Wiktor Stribiżew, Apr 29 '16 at 08:05

score 2 · Accepted Answer · edited May 23 '17 at 10:28

I had to check several things and here ar emy findings:

You need to use [\u0600-\u06FF] regex to match an Arabic character in JS
The full regex you need is var regx = /^[a-zA-Z\u0600-\u06FF,-][\sa-zA-Z\u0600-\u06FF,-]*$/; (see demo)
The JQuery validation plugin does not have regx rule, you need to use pattern from the additional-methods.js
You can also use a dynamic message for the minlength rule: use minlength: jQuery.validator.format("At least {0} characters required!")

See updated JS demo:

var regx = /^[a-zA-Z\u0600-\u06FF,-][\sa-zA-Z\u0600-\u06FF,-]*$/; // E.g. هل بعتم بيتكم في نيويورك
$.validator.setDefaults({
  submitHandler: function() {
   alert("submitted!");
  }
 });

$("#register-form").validate({
  debug: true, // REMOVE THIS, IT IS FOR DEMO DEBUG ONLY!!!
  rules: {
    firstname: {
      required: true,
      pattern: regx,
      minlength: 2
    },
  },
  messages: {
    firstname: {
      required: "please enter name",
      minlength: jQuery.validator.format("At least {0} characters required!"),
      pattern: "enter only english or arabic letters"
    }
  },
  submitHandler: function(form) {
    form.submit();
  }
});

<script src="https://cdn.jsdelivr.net/jquery.validation/1.15.0/jquery.validate.min.js"></script>
<script src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/additional-methods.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="register-form" name="register-form">
 <input type="text" class="ico1" name="firstname" id="firstname" placeholder="enter name " title="enter name "/>
 <input type="Submit"/>
</form>

No idea why the snippet refuses to work here, it works fine at https://jsfiddle.net/3awj76u4/ — Wiktor Stribiżew, Apr 29 '16 at 08:46

score 0 · Answer 2 · answered Apr 29 '16 at 06:44

0

Use the following regex pattern with \p{InArabic} and \p{Latin} Unicode scripts:

...
regx : /^[\p{InArabic}\p{Latin}-,]+(\s?[\p{InArabic}\p{Latin}-, ])*$/

answered Apr 29 '16 at 06:44

RomanPerekhrest

88,541
4
65
105

at least, you should try – RomanPerekhrest Apr 29 '16 at 06:55

Text box should accept both English and Arabic characters using regular expressions

2 Answers2