ngx-select-ex icon indicating copy to clipboard operation
ngx-select-ex copied to clipboard

Focus after select

Open enriqueavg opened this issue 5 years ago • 3 comments
trafficstars

Hi,

Many thanks for develop this component.

I want to use It for select products and then add items to form array. After users select an element we are cleaning items for new request to the api remote data.

I want to add "autofocus" property to input search. I try with this code but this doesn't work.

In html:

<ngx-select [items]="product_items" placeholder="Search..." optionValueField="name" optionTextField="name" [searchCallback]="searchCallback" (typed)="searchProductsTyped.next($event)" (selectionChanges)="addChargeItem($event)" #searchProductsInput>

component.ts: @ViewChild('searchProductsInput', { static: false }) searchProductsInput: ElementRef;

and then:

this.searchProductsInput.nativeElement.focus();

I get this error:

ERROR TypeError: Cannot read property 'focus' of undefined

Thanks for your help.

enriqueavg avatar May 14 '20 21:05 enriqueavg

@enriqueavg Hi. Try to do it after viewing init https://angular.io/guide/lifecycle-hooks#afterview

optimistex avatar May 14 '20 21:05 optimistex

Thanks for you quickly response =).

Pls, can you give more advices for do that?

enriqueavg avatar May 14 '20 21:05 enriqueavg

I try this but input focus still doesn't work.

@ViewChild(NgxSelectComponent) ngxSelectComponent: NgxSelectComponent;
ngAfterViewInit () {
    this.ngxSelectComponent.focusToInput();
    console.log('Hello!')
}

enriqueavg avatar May 14 '20 22:05 enriqueavg