How to mask non Western Latin characters in BootsFaces and PrimeFaces?

Question

I'm in need to add input mask for some input fields using PrimeFaces p:inputMask and BootsFaces p:inputText. The required mask should only accept Arabic letters plus some numbers. my problem is: I do not know how to do that, any help will be appreciate.

Answer 1

Arabic characters can be matched using a regular expression. See Include Arabic characters in JavaScript regular expression?

BootsFaces

1.3 and up

BootsFaces 1.3 and up supports a regular expression in the mask like:

<b:inputText mask="{ regex: '[0-9\u0600-\u06FF]*' }" />

Before 1.3

BootsFaces ships with Inputmask by Robin Herbots. Before 1.3 the mask attribute in b:inputText only allows you to pass a mask expression. In a mask expression you cannot use regular expressions. However, the Inputmask library does support regular expressions. You could create a workaround by omitting the mask attribute in b:inputText, and initialise the mask using JavaScript:

Inputmask({ regex: "[0-9\u0600-\u06FF]*" }).mask("input[type=text]");

0-9 is for matching the numbers, \u0600-\u06FF is for matching the Arabic characters.
With .mask("...") you can select the inputs where the mask should apply.

PrimeFaces

Up to this point (6.2) PrimeFaces inputMask does not support a regular expression. You could use p:inputText with p:keyFilter though:

<p:inputText>
  <p:keyFilter regEx="/[0-9\u0600-\u06FF]/"/>
</p:inputText>

Please note that PrimeFaces is using the JavaScript notation: /pattern/.

Other languages

Your question is how to match Arabic characters in masks. Of course the same solution can be applied for other languages using non Western Latin characters, like:

• Chinese
• Hebrew
• Hindi
• Japanse
• Korean (Hangul)
• Russian (Cyrillic)

For each language / character set it is a matter of finding the right regular expression.