javascript 'focus' w/ Rails 3.1.x

Previous versions of Rails, I could just...

(app/helpers/application_helper.rb)
  def set_focus_to_id(id)
    javascript_tag("$('#{id}').focus()");
  end

then in any view, do something like
<%= set_focus_to_id 'user_uid' %>

but this doesn't work in Rails 3.1.x

What is the new preferred method for doing this?

Previous versions of Rails, I could just...

(app/helpers/application_helper.rb)
def set_focus_to_id(id)
   javascript_tag("$('#{id}').focus()");
end

then in any view, do something like
<%= set_focus_to_id 'user_uid' %>

but this doesn't work in Rails 3.1.x

What is the new preferred method for doing this?

View source (in a browser) and see if you have the prototype.js library loaded. focus() is a Prototype method (unless I'm wrong and it's in jQuery as well) and without the library it won't work.

3.1 switched to jQuery, which annoys me, but there is a gem you can add to put things right again.

One other thing to look at -- is your call to set_focus_to_id appearing (in source) below the element it refers to? If it isn't, then you have to wrap your call in an observer callback, so that you are sure that the DOM is ready and knows about the element you're trying to modify.

If your code is at the bottom of your view, then you should be fine, but if it's above the referenced element, or if it's in a content_for :head block, then you have to do something like this:

#prototype-flavored javascript
document.observe('dom:loaded', function(){
  //your code here
});

Walter

Previous versions of Rails, I could just...

(app/helpers/application_helper.rb)
def set_focus_to_id(id)
  javascript_tag("$('#{id}').focus()");
end

then in any view, do something like
<%= set_focus_to_id 'user_uid' %>

but this doesn't work in Rails 3.1.x

What is the new preferred method for doing this?

View source (in a browser) and see if you have the prototype.js library loaded. focus() is a Prototype method (unless I'm wrong and it's in jQuery as well) and without the library it won't work.

3.1 switched to jQuery, which annoys me, but there is a gem you can add to put things right again.

One other thing to look at -- is your call to set_focus_to_id appearing (in source) below the element it refers to? If it isn't, then you have to wrap your call in an observer callback, so that you are sure that the DOM is ready and knows about the element you're trying to modify.

If your code is at the bottom of your view, then you should be fine, but if it's above the referenced element, or if it's in a content_for :head block, then you have to do something like this:

#prototype-flavored javascript
document.observe('dom:loaded', function(){
//your code here
});

Previous versions of Rails, I could just...

(app/helpers/application_helper.rb)
def set_focus_to_id(id)
javascript_tag("$('#{id}').focus()");
end

then in any view, do something like
<%= set_focus_to_id 'user_uid' %>

but this doesn't work in Rails 3.1.x

What is the new preferred method for doing this?

View source (in a browser) and see if you have the prototype.js library loaded. focus() is a Prototype method (unless I'm wrong and it's in jQuery as well) and without the library it won't work.

3.1 switched to jQuery, which annoys me, but there is a gem you can add to put things right again.

One other thing to look at -- is your call to set_focus_to_id appearing (in source) below the element it refers to? If it isn't, then you have to wrap your call in an observer callback, so that you are sure that the DOM is ready and knows about the element you're trying to modify.

If your code is at the bottom of your view, then you should be fine, but if it's above the referenced element, or if it's in a content_for :head block, then you have to do something like this:

#prototype-flavored javascript
document.observe('dom:loaded', function(){
//your code here
});

----
duh... prototype - I don't think it's useful to load both prototype and jquery as I'm already using a bunch of query.

I'll see if I can figure out how to change that to a jquery friendly method.

$(document).ready(function() {
  $('#yourElement').focus();
});

It's just a matter of making it a CSS selector, rather than an ID selector. In Prototype, you would use the $$() method with a CSS selector, and that method always returns an array, so you would have to write it as $$('#yourElement').invoke('focus');. jQuery returns either a single element or an array, which is one of the many ways it is icky.

Walter

Previous versions of Rails, I could just...

(app/helpers/application_helper.rb)
def set_focus_to_id(id)
javascript_tag("$('#{id}').focus()");
end

then in any view, do something like
<%= set_focus_to_id 'user_uid' %>

but this doesn't work in Rails 3.1.x

What is the new preferred method for doing this?

View source (in a browser) and see if you have the prototype.js library loaded. focus() is a Prototype method (unless I'm wrong and it's in jQuery as well) and without the library it won't work.

3.1 switched to jQuery, which annoys me, but there is a gem you can add to put things right again.

One other thing to look at -- is your call to set_focus_to_id appearing (in source) below the element it refers to? If it isn't, then you have to wrap your call in an observer callback, so that you are sure that the DOM is ready and knows about the element you're trying to modify.

If your code is at the bottom of your view, then you should be fine, but if it's above the referenced element, or if it's in a content_for :head block, then you have to do something like this:

#prototype-flavored javascript
document.observe('dom:loaded', function(){
//your code here
});

----
duh... prototype - I don't think it's useful to load both prototype and jquery as I'm already using a bunch of query.

I'll see if I can figure out how to change that to a jquery friendly method.

$(document).ready(function() {
$('#yourElement').focus();
});

It's just a matter of making it a CSS selector, rather than an ID selector. In Prototype, you would use the $$() method with a CSS selector, and that method always returns an array, so you would have to write it as $$('#yourElement').invoke('focus');. jQuery returns either a single element or an array, which is one of the many ways it is icky.