From 8ec278a500b1cd65394c9cd48603c9ca26d96f7f Mon Sep 17 00:00:00 2001 From: Melloware Date: Wed, 16 Nov 2022 16:55:14 -0500 Subject: [PATCH] Fix #3655: ENTER key on menu filter input applies filter (#3660) --- components/lib/datatable/ColumnFilter.js | 18 +++++++++++++++++- 1 file changed, 17 insertions(+), 1 deletion(-) diff --git a/components/lib/datatable/ColumnFilter.js b/components/lib/datatable/ColumnFilter.js index 6a9da8509b..22f336df67 100644 --- a/components/lib/datatable/ColumnFilter.js +++ b/components/lib/datatable/ColumnFilter.js @@ -197,6 +197,14 @@ export const ColumnFilter = React.memo((props) => { } }; + const onInputKeydown = (event, _index) => { + if (event.key === 'Enter') { + if (!getColumnProp('showApplyButton') || props.display === 'menu') { + applyFilter(); + } + } + }; + const onRowMatchModeChange = (matchMode) => { const filterMatchModeChangeCallback = getColumnProp('onFilterMatchModeChange'); let filters = { ...props.filters }; @@ -442,7 +450,15 @@ export const ColumnFilter = React.memo((props) => { return getColumnProp('filterElement') ? ( ObjectUtils.getJSXElement(getColumnProp('filterElement'), { field, index, filterModel: model, value, filterApplyCallback, filterCallback }) ) : ( - onInputChange(e, index)} className="p-column-filter" placeholder={getColumnProp('filterPlaceholder')} maxLength={getColumnProp('filterMaxLength')} /> + onInputChange(e, index)} + onKeyDown={(e) => onInputKeydown(e, index)} + className="p-column-filter" + placeholder={getColumnProp('filterPlaceholder')} + maxLength={getColumnProp('filterMaxLength')} + /> ); };