How to use the value of an html element in Ruby embedded code

Question

I have the following code:

<% @groups.each do |group| %>
<tr>
   <td id="groupid"><%= group.id %></td>
   <td><a href="#dialog" name="modal"><%= group.title %></a></td>
</tr>
<% end %> 

<div id="boxes">
   <div id="dialog" class="window">
       <strong><%= @groups.find(3).title %></strong> |  
       <a href="#"class="close"/>Close it</a>
   </div>
</div>

When I click on the <%= group.title %> link in the browser I want to get the value stored in <td id="groupid"> and pass it on at <%= @group.find(3).title %> where 3 is...so instead of 3 i would have the value stored in <td id="groupid">

How do I achieve this?

You can't do that directly, you have to use Ajax to request a separate controller action, and call group.find there. — bfavaretto
– bfavaretto, Commented Mar 27, 2012 at 1:50
don't have experience with Ajax, no idea how I would go about doing that!! — bytebiscuit
– bytebiscuit, Commented Mar 27, 2012 at 2:22
@bfavaretto is right, with a slight refinement/opportunity. You can do this without a request to the server using javascript (or jQuery, or CoffeeScript) alone ... assuming you already have the data you want to display in some attribute or value already. From a design standpoint, if you need to do simple things that "shouldn't" need more data from the server, you need to figure out how to pass them up to the DOM so they're visible/accesible to JS. If they are not just "there" already, you can use an attribute like "data-foo" to hold the value of "foo". — Tom Harrison
– Tom Harrison, Commented Mar 27, 2012 at 2:24
yes, for example <td id="groupid"> which is a number is rendered in the browser already, so when I click on the title which also rendered next to the groupid, I want to get the value of groupid and send it to group.find(--here--)... — bytebiscuit
– bytebiscuit, Commented Mar 27, 2012 at 2:28

bfavaretto · Accepted Answer · 2012-03-27 17:28:59Z

1

You can't directly pass a value obtained from javascript (via click event) to Ruby code, because when the javascript code is run, Ruby has already finished its job, and handed the html/js content to the browser. The browser cannot call a Ruby function, it can only make a new request to a Ruby script on the server (e.g., via ajax).

Now, I looked at your code again, and it seems you already have all titles on your HTML, so you could try this:

<script type="text/javascript">
$(document).ready(function(){
    $('td a').on('click', function(){
        var title = $(this).html();
        $('#dialog strong').html(title);
    });
});
</script>

<table>
<% @groups.each do |group| %>
  <tr>
      <!-- id changed to class below; you can't have the same id multiple times -->
      <td class="groupid"><%= group.id %></td>
      <td><a href="#dialog" name="modal"><%= group.title %></a></td>
  </tr>
<% end %> 
</table>
<div id="boxes">
    <div id="dialog" class="window">
        <strong></strong> |  <a href="#"class="close"/>Close it</a>
    </div>
</div>

Note: you need jQuery for this example to work.

edited Mar 27, 2012 at 17:28

answered Mar 27, 2012 at 15:59

bfavaretto

72k18 gold badges118 silver badges162 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

bytebiscuit Over a year ago

thanks for your effort, but unfortunately the code does not work. Also, I'm not trying to pass the value to the <strong> element, i'm trying to get the value from <td class="groupid"> and pass it to <%= @groups.find(3).title %> where the number 3 is !

bfavaretto Over a year ago

Did you understand why that's not possible? The browser cannot see <%[email protected](whatever)%>, so neither can js. And aren't you trying to display the title associated with the id clicked? Why not get it from the content of your <a>? It should be the same as what <%[email protected](whatever)%> would return!

bytebiscuit Over a year ago

that's the thing i'm not trying to get the title only, I'm calling other methods besides ().title. I have some more similar lines below, for instance <%= @groups.find(whatever).description %> ... but since I can't do that within the browser I'm gonna have to look for a way to do through the server-side..

Collectives™ on Stack Overflow

How to use the value of an html element in Ruby embedded code

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related