Páginas

miércoles, 27 de marzo de 2013

[Solved] jQuery UI Autocomplete accent insensitive for catcomplete

jQuery autocomplete is great and works great, but has a bug. Its catcomplete version is case sensitive.

It works...


... but It doesn't work...

I can't be able to find a solution searching on the web and decide to hack the jQuery plugin. I built a solution that works fine:

First of all you have to add a new property to the data array with the possible values to find. this new property will have the label value without accents:

var data = [
      { label: "camión", category: "Cat1", labelNoAccents: "camion" },
      { label: "coche", category: "Cat1",  labelNoAccents: "coche"}
]

After that you have to hack the jquery-ui.js file:

Find $.extend( $.ui.autocomplete, {
Find filter: function(array, term) {

Here is where the filter is done. The variable term is the text yhe user has typed in the search box. Replace all accents:

term=term.replace("á","a");
term=term.replace("ó","o");
...

After that change the comparison from the label property to your new property without accents:

return matcher.test( value.label || value.value || value );
return matcher.test( value.labelNoAccents || value.value || value );

This will find user's search term without accents in your values without accents.

That's all.

Thanks @genisbarrera for his help.

No hay comentarios: