Setting focus to a form field

Rails doesn't set focus to the first form field automatically so you have to do it yourself with a little unobtrusive javascript. Here's a helper that does it:

def set_form_focus
  javascript_tag("Event.observe(window, 'load', function() {
  var firstForm = $A(document.getElementsByTagName('form'))[0];
  Form.focusFirstElement(firstForm);
  });")
end

Uses the Prototype library, so the page must have a javascript_include_tag("prototype") or javascript_include_tag("defaults") or equivalent. The Prototype Form.focusFirstElement requires a form id but my forms often don't have a name or id. So we look for the first form on the page using the DOM function getElementsByTagName. This function returns a node list and it's easier to treat this as an array by passing it to the $A prototype function so that [0] gives the first form. Finally, attach this function to the window load event instead of firing before that. Most browsers would show the focus fine if it fires earlier, but IE ends the whole page to be loaded first.

Place the helper after the element on the page, preferably after the <% end %> tag for the form. One tricky thing: if you use tables to build formatted forms (as I do) make sure the <table> tag is after the <% form_for... or <% form_tag... or <% form_remote_for... tag.

Sometimes I use a formless input field with an associated observer to return results via ajax. To set focus to this field I use this quick helper:

def set_focus(id)
  javascript_tag("Event.observe(window, 'load', $('#{id}').focus());")
end

Again, it must be after the specified field on the page and this field must have an id.