Ionic2 select text in ion-searchbar

Ionic Framework ionic-v3
1

In an ion-input focus event we can select all the text like this

< ion-input (focus)=“selectAll($event)” ></ ion-input >

But in an ion-searchbar it does not work:

< ion-searchbar (focus)=“selectAll($event)”></ ion-searchbar>

The selectAll() code would be:

public selectAll(event): void {
event.target.select();
}

I have seen in ionic’s Github that the input component returns a FocusEvent:

inputFocused(event) {
this.focus.emit(event);
}

On the other hand the ion-searchbar returns a searchbar (this):

inputFocused() {
this.focus.emit(this);

this.isFocused = true;
this.shouldLeftAlign = true;
this.setElementLeft();
}

Why does it not return a FocusEvent too? How can we select all the text in an ion-searchbar when it is focused?

Thank you

2

You should open an issue for this. It’s something that people have brought up a few times, and it makes sense to discuss it in an github issue.

3

I have solved it with:

public selectAll(event): void {
event.inputElement.select();
}

Thank you!

4

If I try:

public selectAll(event): void {
event.target.select();
}

This works in browser. But does not work in app.

But I tried

public selectAll(event): void {
    event.inputElement.select();
}

This does not work at all.

5

This posts refers to ion-searchbar, not ion-input. Are you talking about a ion-search too?