Problem with searchbar.setFocus() on iOS

Ionic Framework ionic-v3
1

Hi,

I got a problem with the searchbar.setFocus() function.

Scenario: In the header is a search icon which toggles an ionic toolbar with the searchbar in it.

In the toggle function I do call the searchbar.setFocus() with a timeout of 50.

Code example:

toggleSearchbar() {
	this.initializeSearchItems();	
	this.searchbarVisible = this.searchbarVisible ? false : true;
	if(this.searchbarVisible){			
		setTimeout(() => {			
		     this.searchbar.setFocus();	
						
		},50);
	}
}

This works fine on android. Input is focused and keyboard slides in.

On iOS, the focus in the input is set, keyboard slides in and than, focus gets lost and keyboard slides out. If I do tap the input field the keyboard slides in as expected.

I did set the “KeyboardDisplayRequiresUserAction” preference in config.xml and the fact that the keyboard at least slides in for half a second or so shows it is generaly working on iOS.

Did someone else build a solution with a hidden searchbar and automatic focus of the input when opening? Am I something missing?

Any help is appreciated.

Greg

2

Just if anyone also struggles with this problem:

I used an ion-button tag for the toggleSearch trigger. This seems to trigger some other event that causes the searchfield to loose focus on iOS.

Changed the trigger element to a div and everything works fine. The moment I do use an “a” tag, button or add the ion-button attribute, iOS is loosing focus again.

1 Like