blueprint
blueprint copied to clipboard
palantir
Autofocus on Editable text ?
It would be so great to have an autofocus prop on EditableText. But even without it, I can't find a way to make my EditableText focus when my component mount, has anyone managed to do it ?
@TeaBough would happily review a submission for such a thing! that'd be a cool feature.
This seems to be possible in the current implementation by setting the isEditing prop to true. This causes the input to be present when the component mounts. Due to the input ref code it automatically pulls focus.
I managed to test this in JS Fiddle using a build of V3
https://jsfiddle.net/81qd7vo0/1/
@TeaBough Does that work for you?
I tried setting isEditing but it did unfocus after the first written letter. What seems to work is this:
ReactDOM.findDOMNode(this).querySelector(".bp3-editable-text-content").dispatchEvent(new Event("focus"));
@giladgray thanks for reopening. I think it would be a great addition to have a autofocus option available on components. The questions is which ones should it be? I'd imagine any component that accepts user input would be a good target, but there could also be cases where it could be useful on buttons, for example.
FWIW autoFocus works just fine when also setting alwaysRenderInput, but this last feature has a bug trying to compute the width before the first focus (#4423)
