Hey guys,
I’ve pretty much exhausted google for these few questions (even ended up on the 3rd page one point - the 3rd page!!!), so I’m hoping someone here can help.
My issues all revolve around focussing on inputs. The App is being used for fulfilment from a warehouse and involves many scan events with a paired bluetooth scanner. Scan order, scan pick tote, scan location then scan the items. Repeat the location and items for all orderlines. Admittedly I might need to look at a different scanner which offers an SDK and a cordova package so I can circumvent the need for inputs but we already have 10+ Motorolla scanners and they are great.
Issue 1: Trying to set focus on the first input when the app is ready:
initialiseApp() { this.platform.ready().then(() => { // toteInput fetched with @ViewChild('toteInput') toteInput; setTimeout(() => this.toteInput.setFocus(), 500); }); }
I can set the focus on the input with a setTimeout as above but if I remove the timeout focus is not set. Is there another function I can utilise that will negate the need for the timeout? I have tried all the angular ones: ngAfterViewInit(), ngAfterContentInit(). etc. While the timeout works I worry about issues with slower connections.
Issues 2 - Every method I try that correctly sets focus on my desktop fails to work in Ionic View
I cannot get a focus set on Ionic View no matter what I try. Is this a known issue perhaps?
I have tried all sorts of Angular methods for setting the focus but i’m finding it difficult because when using an ion-input as below you can’t use the renderer on the input as #toteinput refers to the ion-input object not the actual input that is generated.
<ion-input #toteInput (keyup.enter)="scanTote(toteInput, orderFocusTrigger)"></ion-input>
I had the same issues with buttons. Where all docs I read advise to use
this.buttonElement.nativeElement
Ionic seems to break this and while inspecting the object in console I noticed _elementRef which I was able to use successfully when firing a click event on a button like below.
this._renderer.invokeElementMethod(this.toteFocusTrigger._elementRef.nativeElement, 'click');
Is this the recommended approach to doing this?
I was experimenting with firing a click event on a button which then sets the focus on the input in response to an article I read from someone having similar issues with focus on IOS. This works fine on desktop, but again, not in Ionic View.
I am finding it supppperrrr frustrating to be stuck on something that is so easily done with something like jquery (.focus()) so I’m desperately looking for help. I’m sure I am missing something simple.
Thanks in advance.
Jason.