How to filter accents in a selectCheckboxMenu of primefaces

Question

How to filter accents in a selectCheckboxMenu of primefaces

Navigation

#1 by (1 votes)

5

I have a problem using the selectCheckboxMenu filter, since it does not filter the accents, for example I have this list.

But when filtering for example the letter "a", only that character filters me and not the accented one.

Someone knows how to do so that both characters appear to me when putting with accent or without it.

<p:selectCheckboxMenu id="menu" value="#{ClassBean.selectedItems}" label="Items" filter="true" filterMatchMode="contains">
   <f:selectItems value="#{ClassBean.items}"/>                
</p:selectCheckboxMenu>

I think I did not understand, what happens is that when filter does not filter words with accents, for example I have the words:

Circle Circle Circulated

When I add the filter "cir", I discriminate the first word that starts with an accent.

I want to see if there is a way for me to take accents into account.

java primefaces jsf filtro

asked by zer000 20.04.2018 в 23:02

source

1 answer

Ways to update view-type elements Apply MultiThreading (Parallelism) to my Scraping code in C #

score 1 · Answer 1

To customize the filter, you must define the filterMatchMode attribute as "custom" and use the filterFunction ="myFilter" attribute to define the javascript function used in the filter. the search for the filter, as explained in the Primefaces documentation (451).

In this case, I customize the filter to ignore the accents and special characters that are contained (just like the filterMatchMode="contains" attribute does).

file.xhtml

<p:selectCheckboxMenu filter="true" filterMatchMode="custom" filterFunction="contains" value="#{controllerBean.id}">  
        <f:selectItems value="#{controllerBean.list}"/>
</p:selectCheckboxMenu>

file.js

function contains(itemLabel, filterValue) {

    return itemLabel.includes(filterValue) || specialCharacters(itemLabel).includes(filterValue);

}

function specialCharacters(input){

           var c=input.toLowerCase();
           c = c.replace(new RegExp("\s", 'g'),"");
           c = c.replace(new RegExp("[àáâãäå]", 'g'),"a");
           c = c.replace(new RegExp("æ", 'g'),"ae");
           c = c.replace(new RegExp("ç", 'g'),"c");
           c = c.replace(new RegExp("[èéêë]", 'g'),"e");
           c = c.replace(new RegExp("[ìíîï]", 'g'),"i");                           
           c = c.replace(new RegExp("[òóôõö]", 'g'),"o");
           c = c.replace(new RegExp("œ", 'g'),"oe");
           c = c.replace(new RegExp("[ùúûü]", 'g'),"u");
           c = c.replace(new RegExp("[ýÿ]", 'g'),"y");
           return c;
}

In this way the search will be carried out with or without an accent.

The original publication to this question I published in the forum of Stackoverflow in English, can be consulted here: link

This solution is valid for any similar primefaces component that uses a search filter, for example a selectCheckboxMenu, selectOneListbox or selectOneMenu