How to focus an input element as soon as it is enabled?

Question

I am enabling a text field on click of a button. After onblur event on that input text, I want that it should be hidden. Now in the case when button is clicked and input field is shown, without changing any value inn that field, I am clicking away outside. But that field is not getting hidden, because the onblur event never fired from that field as I never touched it after enabling. Hence I want that as soon as the field is enabled, the focus should be on that input element.

Something as :

As against :

Note: This is in reference with a cell of inline edit type of SLDS-table

Answer 1

You can try to set the focus by using .focus method in the button click function. Check this fiddle link I have created.

document.getElementById("myAnchor").focus();

https://www.w3schools.com/jsref/met_html_focus.asp