【问题标题】:Primefaces dataTable filter on enter输入时的 Primefaces 数据表过滤器
【发布时间】:2015-01-21 02:38:39
【问题描述】:

我正在使用 primefaces 5.0 和带有过滤选项的数据表。但是输入一个字母并等待它过滤和更新然后输入下一个字母是不方便的。它也会减慢服务器的速度。因此需要在填写过滤选项后按回车键,然后过滤。

primefaces 3.5 中有 filterDelay 选项,但我在 primefaces 5 中看不到。

我以前用javascript代码破解如下

$('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;
                            }
                        });
                    });

好吧,它没有用。

如何使用 primefaces 5 做到这一点?

【问题讨论】:

  • 您的桌子上有多个过滤器选项吗?您可以结合 primefaces 的热键和 globalFilter 属性来过滤返回
  • 是的。 19 列上方有 19 个过滤器。我拒绝使用过滤器。很多事情都失控了。因此,只需将 inputText 添加到列标题中,并在用户按下 intputtext 中的 Enter 键时设置隐藏按钮提交。

标签: jsf jsf-2 primefaces filter datatable


【解决方案1】:

对于 2+ 的 Angular 用户,您可以做的不是做(使用来自 https://www.primefaces.org/primeng/#/table/filter 的示例):

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

你可以这样做:

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

【讨论】:

  • 这个问题是关于 PrimeFaces,而不是 PrimeNG
【解决方案2】:

根据 PrimeFaces 用户指南(5.0 和 5.1),仍然有选项 filterEvent="..." 和 filterDelay="..."

名称:filterEvent,默认值:keyup,类型:String,描述:为输入过滤器调用过滤的事件时间>。 名称:filterDelay,默认值:300,类型:Integer,描述:发送ajax过滤查询前的延迟毫秒数。 em>

这两个选项都适用于标签 p:dataTable

我想这两个应该可以解决您的问题。 (Delay 选项,如果您愿意更改为列上的过滤器,或者另一方面 filterEvent 选项,它仍然存在)。

【讨论】:

    【解决方案3】:

    5.2 Userguide (Chapter 3.32)DataTable 中还有一个filterDelay 选项。它不适合你吗?

    BalusC 于 2011 年 4 月 7 日在他的博客“How to filter p:dataTable on enter event”中发布了与您非常相似的解决方案。也许您可以从那里调整一些东西。

    【讨论】:

    • 您链接到 a blog by Oleg Varaksin 作为 BalusC 的。你读过博客吗?
    • 好吧,这篇文章很老,而且在这篇文章之后有很多修改过的新版本。不再有 filterEvent 选项。谢谢你:)
    猜你喜欢
    • 2012-02-14
    • 2014-01-04
    • 1970-01-01
    • 2013-08-01
    • 1970-01-01
    • 2012-11-01
    • 2014-03-01
    • 1970-01-01
    • 2017-01-21
    相关资源
    最近更新 更多