How to check Unicode input value in JavaScript?

Question

I want to allow the user to input only Khmer character (Unicode character) and raise an alert if otherwise.

Khmer Name: <input type="text" class="namekh" name="namekh">

In order to do so, my sample script is like this:

<script>
  var namekh = $('.namekh').val();

  // function to check unicode or not
  if (isUnicodeFunc(namekh) == true) {
    alert('unicode character');
  } else {
    alert('please enter unicode only');
  }
</script>

How can I define function isUnicodeFunc to detect if the value is Unicode or not?

Answer 1

According to Wikipedia, the Khmer alphabet is unicode range 0x1780 to 0x17FF and 0x19E0 to 0x19FF, so you can simply test that all the characters in the string are in that range: https://jsfiddle.net/8o87jgys/1/

function isUnicodeFunc(string) {
    let isKhmer = true;
    for (let i = 0; i < string.length; i++) {
        let code = string.charCodeAt(i);
        if (code < 0x1780 || (code > 0x17FF && code < 0x19E0) || code > 0x19FF) {
            isKhmer = false;
            break;
        }
    }

    return isKhmer;
}

Answer 2

You could test the input with a regex.

var myRegex  = new RegExp('[ក-\u17fe᧠-᧾]', 'gi');;

function isKhmerChar(textInput){
    return myRegex.test(textInput);
}

There are tools from where you can get the regular expression like Unicode range RegExp generator, this one works for javascript unicode characters.

RegExp MDN

RegExp.prototype.test() MDN

Answer 3

You can use RegEx for a simple solution. See the first function which will test if a given string contains only Khmer characters. Here is an explanation, what is matched with the following RegEx rule.

function checkKhmerCharacters( val ) {
  // Khmer range found at https://en.wikipedia.org/wiki/Khmer_alphabet
  return /^[\u1780-\u17FF\u19E0-\u19FF]$/.test( val );
}

// Validate as you type
$( 'input' ).on( 'input', function ( e ) {
  const elm = $( this );
  const isValid = checkKhmerCharacters( e.target.value );
  elm.toggleClass( 'input-error', !isValid );
} );

$( 'button' ).on( 'click', () => {
  var namekh = $('.namekh').val();
  console.log( checkKhmerCharacters( namekh ) );

  if( checkKhmerCharacters( namekh ) ) {
    alert( 'unicode character' );
  }
  else {
    alert( 'please enter unicode only' );
  }
} );

.input-error {
  border: red 3px solid;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Khmer Name: <input type="text" class="namekh" name="namekh"> <button>Check</button>

Answer 4

Based on the unicode table you have to check if a string has a charackter with the charcode between 0x1780 to 0x17FF or 0x19e0 to 0x19FF.
You can split the string to receive an array. This array you can loop with some. some() will break the loop if a condition returns false - so you don't have to loop through the whole array

Code

function containsOnlyKahmerCharakter(str) {
  return str.split('').some(function(char) {
    var charCode = char.charCodeAt('0')
    return (
      charCode >= 0x1780 && charCode <= 0x17FF 
      || charCode >= 0x19e0 && charCode <= 0x19FF
    )
  })
}

Example

function containsOnlyKahmerCharakter(str) {
  return str.split('').some(function(char) {
    var charCode = char.charCodeAt('0')
    return (
      charCode >= 0x1780 && charCode <= 0x17FF 
      || charCode >= 0x19e0 && charCode <= 0x19FF
    )
  })
}

console.log(containsOnlyKahmerCharakter('ក ខ គ ឃ ង ច'))

Answer 5

The simplest solution is to use regular expressions with Unicode property escapes and Unicode flag. (ES2018)

/^\p{scx=Khmer}+$/u.test(namekh)

Entire script:

var namekh = document.querySelector('.namekh').value;

if (/^\p{scx=Khmer}+$/u.test(namekh)) {
  alert('unicode character');
} else {
  alert('please enter unicode only');
}