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?


Craig W. ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
[email protected]
1.800.869.6908 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

Need help communicating between generations at work to achieve your
desired success? Let us help!

On Dec 30, 2011, at 11:32 AM, Craig W. wrote:

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

On Dec 30, 2011, at 9:58 AM, Walter Lee D. wrote:

then in any view, do something like
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.

Thanks

Craig

On Dec 30, 2011, at 12:37 PM, Craig W. wrote:

javascript_tag("$(’#{id}’).focus()");


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

On Dec 30, 2011, at 11:46 AM, Walter Lee D. wrote:

What is the new preferred method for doing this?
document.observe(‘dom:loaded’, function(){

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.


well I was trying to implement a generic method of passing a specific ID
variable and having the method in the application_helper.rb so I could
selectively assert which field by ID but I ended up just putting the
following inside the final tag in my layout…

Which just puts the focus on the first field… not the same but
probably good enough for my purposes.

Thanks

Craig

This forum is not affiliated to the Ruby language, Ruby on Rails framework, nor any Ruby applications discussed here.

| Privacy Policy | Terms of Service | Remote Ruby Jobs