Railscasts - RJS Tips

#45

Jun 15, 2007

RJS Tips

This episode is packed with little RJS goodies. Learn the different ways to access an element, how to add "if" conditions and how to apply an effect to multiple elements.

Tags: ajax

Download (21.5 MB, 7:30)

alternative download for iPod & Apple TV (10.4 MB, 7:30)

# do_magic.rjs
page[:reviews].toggle

page[:review_name].value = "this is cool"

page << "if ($('review_name').value == 'foo') {"
page.alert('hi foo!')
page << "}"

page.select("#reviews strong").each do |element|
  element.visual_effect :highlight
end

<%= link_to_function "Show me the Magic!" do |page|
  #...
end %>

< Previous Episode

Next Episode >

19 comments

1. chineseGuy Jun 15, 2007 at 01:12

Oh,very nice and cool!~

Report as Spam

2. incoroneta Jun 15, 2007 at 01:17

let's see

Report as Spam

3. Bruno Jun 15, 2007 at 01:25

Thanks for all your screencasts, Ryan. I always learn something even if English is not my primary language. Speak more slowly perhaps ? (joke).

Report as Spam

4. maze Jun 15, 2007 at 01:45

link_to_funtion is nice! I hope you soon will produce some screencasts that deal with helper methods.

Report as Spam

5. Top Ten Tutorials Jun 15, 2007 at 15:17

Thanks Ryan for another great Railscast.
Please keep them coming.

Report as Spam

6. carmelyne Jun 16, 2007 at 20:43

Busy as a bee, Ryan? Love the snippets.

Report as Spam

7. Ryan Bates Jun 16, 2007 at 22:35

@carmelyne, glad you like it. :)

I actually had the feature done a few days ago, I just didn't upload it until last night. It was still a chore retyping all the code.

I should probably keep the code in a subversion repository as well and add a "tag" for each episode. Hmmm.

Report as Spam

8. foozilla Jun 17, 2007 at 10:27

Another great cast!
Thanks for reading the feedback.

dynamic update with rjs will be a great cast if you can. Thanks again Ryan.

Report as Spam

9. Phillip Jul 10, 2007 at 01:57

Hey Ryan great ca$t, I was wondering if this was the bes appraoach to update a div with something like this:
<% @brands.each do |brand| %>
<%= link_to_remote(image_tag(brand.filename),:url => {:action => 'show_description', :id => brand}, :class => "description") %>
<%- end %>

pretty much passing the :id of brand to a partial how would one go about that?

Report as Spam

10. Ryan Bates Jul 10, 2007 at 07:39

@Phillip, that looks like it will work. If it doesn't you may want to post about this on railsforum.com.

Report as Spam

11. Shoaib Jul 16, 2007 at 03:20

lovin' the casts thanks Ryan. Just a small comment about manipulating DOMs using element proxies. There is one advantage of calling the DOM methods directly over page is that many DOM objects can be affect in one call like:
<code>
page.toggle :image_div, :text_div
</code>
vs.
<code>
page[:image_div].toggle
page[:text_div].toggle
</code>

Report as Spam

12. Jonathan Spooner Sep 04, 2007 at 21:42

Thanks! Your rock!

Report as Spam

13. morb Oct 09, 2007 at 03:28

How does the controller look like?
How does it know to render the rjs?

Report as Spam

14. Ryan Bates Oct 09, 2007 at 10:07

@morb, it isn't necessary to define the action in the controller. Rails will automatically look for a template with the name of the action (do_magic.rjs) and just render that. Nothing significant is in the controller.

Report as Spam

15. dombesz Oct 26, 2009 at 09:36

Hi,

can somebody help me to test this:
page[:review_name].value = "this is cool"
with assert_select_rjs, or any other method will be appreciated.