primefaces
How can I P-ColumnFilter set Auto Focus ?
Describe the feature you would like to see added
How can I P-ColumnFilter set Auto Focus ?
Is your feature request related to a problem?
I try ElementRef working input but P-columnnFilter not work
Describe the solution you'd like
import { AfterContentInit, Directive, ElementRef, Input } from '@angular/core';
@Directive({ selector: '[appAutofocus]' }) export class AutofocusDirective implements AfterContentInit { @Input() public autoFocus: boolean; constructor(private el:ElementRef) { } public ngAfterContentInit(): void { this.el.nativeElement.focus(); } } I use directive but not working on prime dom
Describe alternatives you have considered
No response
Additional context
No response
I would like this feature added as well. In the meantime the below workaround is an option. It consists of an angular module containing one directive that will auto-focus the input element when it is created in the DOM. You can import the module in your app module and then apply the directive to a top-level element that you have in the app component so it takes effect for all tables or apply it to a specific table.
import { Directive, ElementRef, NgModule, OnInit } from "@angular/core";
@Directive({
selector: '[autoFocusColumnFilters]'
})
export class AutoFocusColumnFiltersDirective implements OnInit {
constructor(private elRef: ElementRef) { }
ngOnInit() {
// Note: setTimeout is only needed for use-case where user clicks column filter when another one is already open
new MutationObserver(() => {
setTimeout(() => {
(document.querySelector('p-columnfilterformelement .p-inputtext') as HTMLElement)?.focus();
}, 50);
}).observe(this.elRef.nativeElement, { attributes: false, childList: true, subtree: true })
}
}
@NgModule({
declarations: [
AutoFocusColumnFiltersDirective
],
exports: [
AutoFocusColumnFiltersDirective
]
})
export class AutoFocusColumnFiltersModule { }
Hi,
So sorry for the delayed response! Improvements have been made to many components recently, both in terms of performance and enhancement. Therefore, this improvement may have been developed in another issue ticket without realizing it. You can check this in the documentation. If there is no improvement on this, can you reopen the issue so we can include it in our roadmap? Please don't forget to add your feedback as a comment after reopening the issue. These will be taken into account by us and will contribute to the development of this feature. Thanks a lot for your understanding!
Best Regards,
