Auto-complete with diacritics (tonal marks) in jquery

Question

I'm trying to use jquery-autocomplete with tonal marks in my native language (which is Vietnamese FWIW). It works wonder for exact match of a word. However, I want the search functionality to disregard tonal marks, i.e. searches for both "Lâm" and "Lam" will match "Lâm" by default.

Thank you.

Answer 1

I assume you use autocomplete on client data.

• For javascript code to replace diacritics on latin alphabet, see this answer.
• On the widget side, check the source option.

Here is an outline (not tested) to give you an idea of how you can use a source function :

// use the 'removeDiacritics' function from the quoted answer above
function removeDiacritics(str) {
   ...
}

var myData = ['aäa', 'bbb'];

$('input#autocomplete').autocomplete({
    source: function(request, responseCallback){
        // 'request' holds the value typed in the input,
        // remove diacritics from this value, and build a regexp :
        var reSearch  = new RegExp( removeDiacritics(request) );

        // build an array of matched values :
        var result = [];
        for (var i=0; i<myData.length; i++){
            // for each search candidate, run it through removeDiacritics,
            // and see if result macthes the (diacritics free) regexp :
            if ( reSearch.match( removeDiacritics(myData[i]) ) ){
                result.push(myData[i]);
            }
        }

        // call the callback with this array :
        responseCallback(result);
    }
});