Auto select input field when toggle is actioned

Question

I have a search bar that only displayed when the toggle button is clicked. The code I am using to do this is:

$("a.search-toggle").click(function(){
    $(".search-bar").slideToggle(200);
    $(this).toggleClass("open");
});

Now I am trying to find a way to auto select the input[type="search"] field when this toggle is actioned. Currently the user has to click the toggle button, then click the search field which isn't very user friendly.

Note

I am not looking for this to occur on page load, only once toggle has been activated.

score 1 · Accepted Answer · answered Dec 05 '17 at 10:27

1

This should do it

$('input[type="search"]').focus();

See the docs here

answered Dec 05 '17 at 10:27

bitshift

498
2
13

Perfect - thank you :) – CharlyAnderson Dec 05 '17 at 10:29
@CharlyAnderson If the answer solved your problem, please mark it as accepted – bitshift Dec 05 '17 at 10:32
1

sure will do - as soon as it lets me. Thanks again. – CharlyAnderson Dec 05 '17 at 10:34

Auto select input field when toggle is actioned

Note

1 Answers1