0

On Click I call a javascript where I have captured the radio button value into a variable in the javascript. I then call a render partial passing this radio button variable as local.
I get the error: undefined local variable or method `radio_button_value' for #<#.

Here is my javascript code:

 <script>
 function render_dir_partial() {
     alert('in javascript.');
     alert("you chose the option: " + $('form input[type=radio]:checked').val() );
     radio_button_value = $('form input[type=radio]:checked').val();
     alert ("radio_button_value: " + radio_button_value );
     $('#dir_list').html('<%=j render :partial => "dir_list", :locals => { :dir_choice =>     radio_button_value } %>')
}
</script>

When I run the app, this aleart shows the correct value assigned based on the radio button clicked: alert ("radio_button_value: " + radio_button_value );

If I hard code a value into the code, instead of the variable, everything works fine. Can you please help me figure out the proper syntax to pass the value for radio_button_value to dir_choice?

I did alot of research and everything shows how to read the value when the variable comes from a model defined object.

Here is the hardcoded string that works.

<script>
function render_dir_partial() {
    alert('in javascript.');
    alert("you chose the option: " + $('form input[type=radio]:checked').val() );
    radio_button_value = $('form input[type=radio]:checked').val();
    alert ("radio_button_value: " + radio_button_value );
    $('#dir_list').html('<%=j render :partial => "dir_list", :locals => { :dir_choice =>   "watchfolder" } %>')
}
</script>
Carol Brown
  • 19
  • 4

4 Answers4

1

Presumably, the following code is in some html.erb file:

<script>
 function render_dir_partial() {
     alert('in javascript.');
     alert("you chose the option: " + $('form input[type=radio]:checked').val() );
     radio_button_value = $('form input[type=radio]:checked').val();
     alert ("radio_button_value: " + radio_button_value );
     $('#dir_list').html('<%=j render :partial => "dir_list", :locals => { :dir_choice =>     radio_button_value } %>')
}
</script>

When your browser requests the html.erb file containing that code, here are the steps that occur:

  1. Rails executes the erb code in that file, converting the file to only html and javascript.
  2. The server sends the converted file to your browser.
  3. Your browser executes the javascript at the appropriate time.

The radio_button_value variable isn't created until step #3, i.e. when the js function render_dir_partial() executes, which could be in 10 years. However, in step #1 rails must assign to the local variable dir_choice the value of a variable called radio_button_value--right now!

But even if your js script looked like this:

<script>
  var radio_button_value = "hello";

  $('#dir_list').html('<%=j render :partial => "dir_list", :locals => { :dir_choice =>     radio_button_value } %>')
}
</script>

...you would still get the same error because:

  1. The js radio_button_value variable still won't exist until the browser receives the file, yet rails has to assign the value of a radio_button_value variable to the dir_choice variable before the server sends the page to the browser.

  2. And here is the real problem: Ruby code can't even refer to variables in js code and vice versa. If your ruby code mentions a variable called radio_button_value, then it has to be defined in the ruby code when the ruby code executes. Ruby code has no idea that javascript has even been invented yet. And if you mention a variable called radio_button_value in js code, it has to be defined in the js code when the js code executes.

7stud
  • 46,922
  • 14
  • 101
  • 127
0

ruby_button_value its a JS variable, Ruby will never understand that because it technically doesn't even exists when the ruby is done loading (Ruby runs on the server, JS on the client).

What you'd do its pass the ruby_button_value via AJAX to your controller and then fetch the variable value based on that.

Oscar Valdez Esquea
  • 890
  • 1
  • 11
  • 26
0

This wouldn't work the way you want it to.

When requested, Ruby runs on the server and generates HTML and JS code. This HTML markup is sent to the client, where it is rendered by the browser. Now the problem here is, your browser doesn't understands Ruby, just HTML and JS. So it would treat your Ruby script as a string(because of the qoutes), and simply print it in your div.

The way to go would be to send an AJAX request to your server(which understands Ruby), and make it return HTML/JS, something that the browser would understand.

Maybe you'll want to look into these.

richonrails.com/articles/basic-ajax-in-ruby-on-rails

www.tutorialspoint.com/ruby-on-rails/rails-and-ajax.htm

TranQ
  • 1,381
  • 1
  • 9
  • 10
0

I was trying to do the same thing, but you can't really do what you're trying to do.

Ruby will evaluate the string '<%=j render :partial => "dir_list", :locals => { :dir_choice => radio_button_value } %>' and will give an error because radio_button_value is not defined in Ruby. If you were to insert a javascript variable there, Ruby will give the same error because the javascript variable will not be defined in Ruby either. This all happens at the time of server execution, before the code even hits the browser, which is where the javascript is executed.

Thus, we have two options:

  1. Execute all the logic on the server side. The dropdown will submit a form which will pass the variable in the url params.

  2. Ajax. Javascript will make an http request to the server and render the results. check out www.tutorialspoint.com/ruby-on-rails/rails-and-ajax.htm

freeslugs
  • 1