【问题标题】:Auto-submitting HTML select drop-down in Rails在 Rails 中自动提交 HTML 选择下拉菜单
【发布时间】:2012-09-24 10:14:23
【问题描述】:

我有一个使用 HTML 选择标签的简单下拉菜单。 select标签的代码变成:

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

在我的 menu.js.coffee 文件中,我有:

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

这变成了 menu.js:

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

问题是更改选择菜单不提交表单!它甚至没有输入上面的 menu.js 代码(我在那里放置了断点,并且在选择菜单选项后它永远不会进入)。

如果我只是复制上述(function() { 的内部内容,然后将其粘贴到 Firebug 或 Chrome 控制台中,那么它会按预期运行并且更改菜单实际上会提交表单。那么我应该如何在rails中编写coffeescript代码以允许在选择菜单更改时提交表单?

我使用的是 Rails 3.2.8。

【问题讨论】:

  • 您是否尝试过将代码放入$(document).ready () -&gt; 块中?
  • @DaveTsunami - 这就是问题所在!我曾假设 .js.coffee 文件中的任何内容都会在页面加载后加载。所以代码正在运行,但select#menu_id 还不存在。将您的评论放入答案中,我会给您信用。

标签: javascript jquery ruby-on-rails ruby-on-rails-3 html


【解决方案1】:

尝试将您的代码放入 $(document).ready () -&gt; 块中。

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

【讨论】:

    【解决方案2】:

    document.ready 函数仅在页面重新加载时使用。 您可以使用单独的函数并使用 onchange 调用。

    例子:

        <select name="menu_id" id="menu_id" onchange="callThisFunction()">
        <option selected="selected" value="1">Dinner</option>
        <option value="2">Lunch</option>
        </select>
    
        <form name="myform"></form>
    
        function callThisFunction()
        {
          document.forms["myform"].submit();
        }
    

    【讨论】:

    • 你提议的方式并不引人注目。此外,触发callThisFunctiononchange 事件并没有提交表单,它只是绑定了一个新的onchange 事件。在第一次运行时,它不仅会绑定新事件。在第二次运行时,它将再次绑定另一个 onchange 事件并提交表单。这不是正确的方法。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2011-03-08
    • 2019-06-11
    • 1970-01-01
    • 1970-01-01
    • 2019-11-11
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多