Question

I have a simple drop-down menu using HTML’s select tag. The code for the select tag becomes:

<select name="menu_id" id="menu_id">
  <option selected="selected" value="1">Dinner</option>
  <option value="2">Lunch</option>
</select>

In my menu.js.coffee file I have:

$("select#menu_id").change(-> $(this).closest("form").submit())

This becomes menu.js:

(function() {
  $("select#menu_id").change(function() {
    return $(this).closest("form").submit();
  });
}).call(this);

The problem is changing the select menu doesn’t submit the form! It doesn’t even enter the above menu.js code (I place breakpoints there and it never enters after selecting a menu option).

If I then just copy the inside of the above (function() {, and I paste it into the Firebug or Chrome console, then it runs as expected and changing the menu does in fact submit the form. So how am I supposed to write the coffeescript code in rails to allow forms to be submitted when a select menu is changed?

I’m using Rails 3.2.8.

Answer 1

Try putting your code inside the $(document).ready () -> block.

$(document).ready () ->
  $("select#menu_id").change(-> $(this).closest("form").submit())