CODEWITHSUNDEEP
javascriptjqueryjqgrid
Kai
Kai

Reputation: 207

jqGrid custom filtering with build in filtering toolbar

I'm using the latest jqGrid version and I'm wondering if it's possible to do local filtering with custom rules (see example below). First of all, the filter toolbar can be switched on by applying

jQuery("#grid").jqGrid('filterToolbar', options);

In the past I implemented this manually (the version I currently use does not support local filtering, so I added this feature according the my needs) and now, after an update to the latest version, I asked myself if jqGrid offers this functionalty by default (Not the local filtering, which it does, but the custom filtering rules) as the functionality impressively increased over the last months. I read the documentation and searched the internet, but did not find a suitable example.

Here is an example of what I want to achieve.

There's a column First Name which hold the first name of the persons displayed. 

Stefan
Stephan
Stephano
Stelios
Philip
Phillip
Philipp
Ivan
Iwan
...

Now the user enters Ste in the filtering bar for column First Name and the result with the default filtering algorithm should be :)

Stefan
Stephan
Stephano
Stelios

So far so good. But what if I want to display names which are ortographically similar? I want the user to enter Ste*an* to only display

Stefan
Stephan
Stephano

So you see, * stands for a wildcard for any character zero or more times. Additionally I want the user to be able to enter Ste?an* resulting in 

Stefan

where ? means any character exactly once. One last requirement is to make the filtering more tolerant and matching not only the hole line (starting and ending, equivalent to regular expressions), but matching the column value if it contains the text entered, i.e. e*o matching

Stephano
Stelios

If you could give me a hint with the * wildcard, the other problems should right themselves.

Thanks in advance

Kai

Upvotes: 2

Views: 9747

Answers (1)

Oleg
Oleg

Reputation: 221997

In my old answers here and here I described how one can implement custom filtering.

If you in the demo type for example "ev" in the filter for 'Client' column you will see the following:

enter image description here

You can easy modify the demo to make for example 'Stephan' and 'Stefan' equivalent.

I personally use mostly defaultSearch: 'cn' in the filterToolbar options. Together with the usage of ignoreCase: true it follow to very good user experience. In my personal opinion such filtering is good enough. More advanced user can use Advanced Searching to create the filter like 'begin with' "Ste" AND 'contains' "an" instead of Ste*an*.

Nevertheless you can use idea from my old demo to overwrite some internal searching methods used by jqGrid.

Upvotes: 3

Related Questions