How to select text when ion-input clicked


#1

I have some ion-input, and when I clik on one, I want the text selected, and when I press next on the keyboard and select the next ion-input, I want the same behavior(the text selected) with the keyboard open. Any idea?


#2

I want to do something like the document.getElementById("txtInput").select();, but called everytime I click on the ion-input.


#3

I’m not 100% sure this will work in ion-input, but try this:

<ion-input (focus)="this.select()">

You might have to play around with it a bit because it’s an ion-input and not a standard input. But that general idea should work. Use the Angular focus event and the HTMLInputElement select() method. You might need to create a method in the ts file, and have the focus event trigger that method.


#4

Doesn’t work the (focus)="this.select()", (click)="this.select()", #myInput (click)="myInput.select()".

The only how works is the (click)="$event.target.select()", but you need to double click, or click above the text to select it. And it don’t work on devices. :sob: