I’m using Jordan Robert Dobson's InputField module.
When the input field gets focus I want the text in the field to be highlighted. Any ideas how to do this?
I use inputLayer.input.focus() to give focus to my input field but how do I select and highlight the text value it contains?
I’ve tried inputLayer.input.setSelectionRange(0, inputLayer.value.length) but this doesn’t do anything.
Jordan Robert Dobson himself can probably answer you better, I've just played around with his module a bit and this seems to work for me:
colorInput = new InputField type: "text" width: Screen.width - 36 height: 132 x: Align.center y: Align.center value: "Hello, Hey, Hi?"
colorInput.on Events.Focus, -> @input.style.color = 'red'
Or by 'highlight' do you mean something other than just changing the input layer style?
I mean make the text be selected so if you type the whole value is replaced rather than putting the insertion point at the end of the existing text value.
Oh shoot, I just realized you mean to literally highlighting the whole thing. I've just put setSelectionRange() inside the event listener and it seems to work:
Giles Perry Yeah I've just realized what you meant. I think what you did should work, maybe the problem is at a different part?
Webkit makes it impossible to select the text directly. But with a short delay it works. This should work:input.on Events.Focus, -> Utils.delay 0, => @input.select()
Btw, we use the same trick for the input fields in Framer Design ;)
I'll give that a try. Thanks.
Not sure if this works on mobile, but there's css "user-select:all", which does exactly this - at least on desktop!