Menu
how to allow only arabic characters in form text field using jquery
I tried with this but the arrows are not allowing to get back from last line
Let me know if any or edit my code or give any new code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Character Filtering</title>
<script type="text/javascript">
function CheckArabicOnly(field) {
var sNewVal = "";
var sFieldVal = field.value;
for (var i = 0; i < sFieldVal.length; i++) {
var ch = sFieldVal.charAt(i),
c = ch.charCodeAt(0);
if (field.keyCode = '38') {
}
else if (field.keyCode = '40') {
// down arrow
}
else if (field.keyCode = '37') {
}
else if (field.keyCode = '39') {
// right arrow
}
if (c < 1536 || c > 1791) {
// Discard
}
else {
sNewVal += ch;
}
}
field.value = sNewVal;
}
</script>
</head>
<body>
Arabic Only (onchange):
<input type="text"
id="txtArabic"
onchange="CheckArabicOnly(this);"
onkeypress="CheckArabicOnly(this);"
onkeyup="CheckArabicOnly(this);"
onpaste="CheckArabicOnly(this);" />
<br />
</body>
</html>
256
As of Unicode 6.1, the Arabic script is contained in the following blocks (from Regular Expression For Arabic Language)
Arabic (0600—06FF, 225 characters)
Arabic Supplement (0750—077F, 48 characters)
Arabic Extended-A (08A0—08FF, 39 characters)
Arabic Presentation Forms-A (FB50—FDFF, 608 characters)
Arabic Presentation Forms-B (FE70—FEFF, 140 characters)
Rumi Numeral Symbols (10E60—10E7F, 31 characters)
Arabic Mathematical Alphabetic Symbols (1EE00—1EEFF, 143 characters)
Use a regexp validation for your text field with whatever framework you are using.
var isArabic = /^([\u0600-\u06ff]|[\u0750-\u077f]|[\ufb50-\ufbc1]|[\ufbd3-\ufd3f]|[\ufd50-\ufd8f]|[\ufd92-\ufdc7]|[\ufe70-\ufefc]|[\ufdf0-\ufdfd])*$/g;
// Solution 1: This will add an error class when the input does not match
$("#txtArabic1").change(function() {
$(this).toggleClass("has-error", !isArabic.test(this.value));
})
// Solution 2: This will not let the user type chars that are not arabic
// but seem to fail on my browser... I don't quite get how does
// javascript splits the string.
$("#txtArabic2").bind('keyup', function(e) {
var filterFn = isArabic.test.bind(isArabic),
newValue = this.value.split('').filter(filterFn).join('');
if (this.value != newValue)
this.value = newValue;
});
Here is a jsfiddle
157
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
