Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Ruby on rails: using javascript variable in <%= %> tags in Html.erb

I am trying to use insert an Javascript variable in the <%= %> tags but it prints the variable name verbose. Here is my code

<script>
     function getGraph(agency,device_id)
      {
            var i = document.createElement('img'); 
            i.src = '<%= show_graph_hcfcd_url('device_id') %>'; 
            $(graphDiv).appendChild(i); 
      }
</script>

Now the Problem is URL gets generated just fine except instead of value of device_id, 'device_id' appears in the rest url.

Any clues how to get over this?

like image 228
Shaunak Avatar asked May 09 '11 18:05

Shaunak


Video Answer


2 Answers

<%= %> will interpret the code on the server

and javascript variable is available to change on the client. So doing

<%= show_graph_hcfcd_url('device_id') %>

is probably not be the correct way of doing this.

You might want to try to put the url(s) in the data attibute of the element:

<div id="device_id" data-url="<%= show_graph_hcfcd_url(@device.id) %>">...</div>

<script>
     function getGraph(agency,device_id)
      {
            var i = document.createElement('img'); 
            i.src = $(device_id).data("url"); 
            $(graphDiv).appendChild(i); 
      }
</script>

also see

http://railscasts.com/episodes/324-passing-data-to-javascript

There's a good gem to do this called "gon"

like image 87
montrealmike Avatar answered Sep 21 '22 14:09

montrealmike


Here is how i have solved this for now:

<script>
     function getGraph(agency,device_id)
      {

            var i = document.createElement('img'); 
            var url = '<%= show_graph_hcfcd_url('device_id') %>'; //new change
            url = url.replace('device_id',""+(device_id*1000));   //new change
            i.src = url;
            $(graphDiv).innerHTML = "";
            $(graphDiv).appendChild(i); 
      }
  </script>

The lines in the bold show what i did. Basically replaced the "device_id" in the url with its value.

But I am still hoping for a more elegant solution.

like image 34
Shaunak Avatar answered Sep 20 '22 14:09

Shaunak