CODEWITHSUNDEEP
jsfjsf-2primefacesfilterdatatable
jakentus
jakentus

Reputation: 896

Primefaces dataTable filter on enter

I am using primefaces 5.0 and datatable with filter option. But it is unconvenient to type one letter and wait when it is will filter and update then type next letter. It is also slows a server. Therefore there is need for press enter key after you fill filter option and then filter.

There was filterDelay option in primefaces 3.5 but I dont see in primefaces 5.

I used to hack by javascript code as follows

$('th .ui-column-filter').each(function() {
                        var inp = $(this);
                        inp.unbind('keydown');
                        inp.unbind('keyup');
                        inp.unbind('keypress');
                        inp.keypress(function(event) {
                            if (event.keyCode == 13) {
                                alert("entered");
                                event.stopPropagation();
                                gwsReportAllPartListDataTable.filter();
                                return false;
                            }
                        });
                    });

Well, it did not work.

How can I do it with primefaces 5?

Upvotes: 1

Views: 8401

Answers (3)

Samuel
Samuel

Reputation: 25

For the angular 2+ users out there what you can do is instead of doing(using the example from https://www.primefaces.org/primeng/#/table/filter): 

<input *ngSwitchCase="'vin'" pInputText type="text" (input)="dt.filter($event.target.value, col.field, col.filterMatchMode)">

You can do:

<input *ngSwitchCase="'vin'" pInputText type="text" (keyup.enter)="dt.filter($event.target.value, col.field, col.filterMatchMode)">

Upvotes: -3

Mistral
Mistral

Reputation: 126

According to the PrimeFaces User Guide (5.0 and 5.1), there still is the option filterEvent="..." and also filterDelay="..."

Name: filterEvent, Default: keyup, Type: String, Description: Event to invoke filtering for input filters. Name: filterDelay, Default: 300, Type: Integer, Description: Delay in milliseconds before sending an ajax filter query.

Both options are for the tag p:dataTable

One of these two should solve your problem, I guess. (the Delay option, if you were willing to change to filters on the columns, or on the other hand the filterEvent option, which is still existent).

Upvotes: 5

Alexander Ermer
Alexander Ermer

Reputation: 433

In the 5.2 Userguide (Chapter 3.32) there is still a filterDelay option in the DataTable. Doesn't it work for you?

A very similar solution to your was posted by BalusC in his blog "How to filter p:dataTable on enter event" from April 7, 2011. Maybe you can adapt something from there.

Upvotes: 1

Related Questions