你能帮我在 Rails 3.2 - jQuery 应用程序中显示一个微调器吗？

Question

我在使用 jQuery 的 Rails 3.2 应用程序中显示微调器时遇到问题。

输入 site/assets/javascripts/application.js 会显示下面的代码，所以我知道它正在加载。

更新了反馈 - 在我的 assets/javascripts/site.js 中：

$(document).ready(function() {
  $("#change_item").change(function() {
    $("#spinner").show();
    var item_id = $(this).val();
    var url = "/system/" + item_id + "/change_item/";
    $.post(url, item_id, function(html) {
    $("#spinner").hide();
    window.location.reload(true);
    });
  });
});

下拉菜单：

<%= select_tag "current_item", options_from_collection_for_select(current_user.accessible_items, "id", "name", session[:item]), :id=>"change_item" %>

在我的布局文件中：

    <div id = "spinner" style = "display:none;"><%= image_tag "spinner.gif" %></div>

我已将我正在做的事情与众多 Google 结果进行比较，但无法确定我做错了什么。

谢谢。

Answer 1

嗨，Jay 在您的代码中，您混合使用了 jQuery.post() 和 jQuery.ajax：第一个实际上是另一个的简写，所以您应该只使用一个。

你的代码应该是这样的：

  $.post(url, item_id, function(html) {
    window.location.reload(true);
    $("#spinner").hide();
  });

第三个参数是ajax调用的回调。

实际上，您甚至可以使用ujs 缩短此代码，这是一种简化这些操作的非常简单的方法，但这取决于您的实际代码；如果您有不显眼地指向其他页面的链接，则特别好。

--

在您发表评论后更新 - “不工作的部分是 $("#spinner").show()”：对我来说这完美无缺：

<%= select_tag "current_item", options_from_collection_for_select(User.all, 'id', 'name'), :id=>"change_item" %>

$(document).ready(function() {
  $("#change_item").change(function() {
    $("#spinner").show();
    // any code after this line should not affect the #spinner.show()
  });
});

Answer 2

似乎select_tag 会自动生成一个ID。我不确定您是否可以手动覆盖它。请参阅我链接到的 API 中的示例。

所以，在你的情况下：

<%= select_tag "current_item", ... %>

将生成以下 HTML：

<select name="current_item" id="current_item">

解决方案是在您的 JavaScript 中使用 #current_item 而不是 #change_item。这是我唯一能想到的。除了这个your code works fine。

（当然除了在 Ajax 调用之后无意义地使用 window.location.reload(true);。如果您要重新加载页面，为什么还要使用 Ajax？）

如果这不能解决您的问题，请发布为 select 标签生成的 HTML。