User login

Home ›
 For usability, Drupal should focus on the first relevant form field

For usability, Drupal should focus on the first relevant form field

Submitted by Benjamin Melançon on October 8, 2008 - 7:18pm
in
Searched words: 
jquery focus on first drupal form on the page usability enhancement automatically highlight form field element in keyboard navigation

For a basic, but nice, usability improvement Drupal, for all pages where a form is the center of attention, the first form field that people should type in should have the keyboard focus given to it.

Here's a method for doing it with JQuery: http://www.gerd-riesselmann.net/development/focus-first-form-field-with-jquery

This would have to skip the search field, which is often at the top, unless the search field were the only form field on a page, in which case it might make a lot of sense to target the search field. It should also not focus on send-to-friend and other miscellaneous fields in sidebars or other non-main forms.

Of course, there's a module for thatTM

http://drupal.org/project/focus

Resolution

Comments

what if I dont want to skip search field

Submitted by eric (not verified) on August 5, 2009 - 7:33pm.

the drupal module doesnt seem to work correctly with the search textfield provided when you are using it in view filtering.

Post new comment

The content of this field is kept private and will not be shown publicly.
  • Internal paths in single or double quotes, written as "internal:node/99", for example, are replaced with the appropriate absolute URL or path. Paths to files in single or double quotes, written as "files:somefile.ext", for example, are replaced with the appropriate URL that can be used to download the file.
  • You may post code using <code>...</code> (generic) or <?php ... ?> (highlighted PHP) tags.
  • You can use Markdown syntax to format and style the text. Also see Markdown Extra for tables, footnotes, and more.
  • Web page addresses and e-mail addresses turn into links automatically.
  • Allowed HTML tags: <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd> <img> <blockquote> <small> <h2> <h3> <h4> <h5> <h6> <sub> <sup> <p> <br> <strike> <table> <tr> <td> <thead> <th> <tbody> <tt> <output>
  • Syntax highlight code surrounded by the {syntaxhighlighter SPEC}...{/syntaxhighlighter} tags, where SPEC is a Syntaxhighlighter options string or "class="OPTIONS" title="the title".
  • Lines and paragraphs break automatically.

More information about formatting options

By submitting this form, you accept the Mollom privacy policy.