Set focus on first field with jQuery
f you are using Prototype see this post.
Setting focus on the first text field with jQuery is as simple as
$("input:text:first").focus();
$("input:text:visible:first").focus();
Find more at http://docs.jquery.com/Selectors
Update: If you are on Rails you can use auto_focusable_forms, dependency free plugin that will focus first input for you.
Nice code, jquery is cool. Thanks for the example.
If you want to have more control about this there’s another alternative with this plugin:
http://github.com/dcadenas/auto_focusable_forms/tree/master
-After you install it you will have automatically focused your first inputs without adding a single line of code to your app.
-Another nice thing is that you can disable this behaviour by just passing “:autofocus => false” to your forms_for.
-Another advantage is that there’s no dependency with Prototype or JQuery.
Oh sorry, there are some dependencies, you’ll need Rails and a browser that can understand javascript ;)
one extra bit add a visible
$(“input:text:first:visible”).focus();
how about $(”input:text:visible:first”).focus();?
I am not sure how filter work, but if they are taken from left to right, then visible should be filtered out first.
“how about $(”input:text:visible:first”).focus();?”
Actually, that should be: $(“:input:text:visible:first”).focus();
This will grab focus to the first form field, regardles sof type (select, input, textarea).
Correction, I meant to remove the :text part of my query. Should be:
$(“:input:visible:first”).focus();
How would you do this to a named input field? Or should I assign it a class or id value?
I would rather do it by its name.
Thanks.
Bill
@Bill
I think what you need is:
$(“input[name='myname']“).focus()