Rails-Ajax，带有不显眼的javascript jqueryui进度条

我想实现一个进度条，我从jqueryui上取下，将max设置为用户给出的任何数字，并将值设置为需要多少

我在我的活动展示页面上有一个供志愿者使用的ajax表单，一切正常

然而，在我尝试创建一个新的志愿者后，页面上的每个进度条都会更新为刚刚创建的进度条

这是我刚刚扔进我的_东西中的javascript，部分要呈现出来：

%ul.thumbnails

- @stuffs.each do |stuff|
    = javascript_tag do 
        var a = parseInt($('.quantity-have').text());
        var b = parseInt($('.quantity-needed').text());
        $(".progressbar").progressbar({value: a, max: b });

这里有一个链接，指向正在发生的事情的图片：

所以我就按了第一个项目的志愿者按钮。。。。。 在志愿者表格上输入信息 在create操作中进行ajax调用 还有我的

create.js.erb

$("#new_volunteer").hide();
$('.form').fadeOut();
$('.overlay').remove();
$('.item-collection').html('<%= j render("stuffs/stuff") %>');

它正在我的展示页面上为事件模型呈现 （不知道这是否相关，我只是想把它扔进去）

我知道它为什么这样做，因为在我的javascript中，我只是告诉它只找到一篇文章的值，但我需要找到每一篇文章的值。

在你的

$（“.progressbar”）.progressbar（{value:a，max:b}）行您正在初始化所有现有进度条上的进度条-您需要确保只针对循环中的相关进度条

要做到这一点，请尝试在每个进度条上设置一个唯一的ID，例如：
.progressbar{ID:“progressbar-{stuff.ID}
，然后更改javascript以引用该特定ID:
$（“#progressbar-{stuff.ID}”）.progressbar（{value:a，max:b}）
在控制器的创建操作中，确保返回要更新的进度条id：

respond_to do |format|
  format.js { render "create", locals: {id: stuff.id} }
end

然后，使用该id，您可以更新正确项目的进度条。确保将
.caption
元素的id设置为
stuff.id
（而不是设置进度条id），以便可以使用
create.js.erb
文件中的正确数量更新正确的进度条：

var a = parseInt($('#caption_#{id} .quantity-have').text());
var b = parseInt($('#caption_#{id} .quantity-needed').text());
$("#caption_#{id} .progressbar").progressbar({value: a, max: b });

我是否必须在javascript中以某种方式逃避它？我知道你在做什么，这是个好主意，但它不起作用……我没有收到任何错误，只是没有在页面上呈现在我的js文件中，我认为它引用的东西不正确。IDI不可能使用$（此）在js.erb文件中，您是否能够检查生成页面的源代码，并查看进度条的ID是否正确呈现，以及通过AJAX调用的Javascript中的ID？我可以检查源代码…正在设置相应的ID…#progressbar-14…。但是我不确定如何检查Javascript中的AJAX调用…。但是如何在我的JS.ERB文件中使用stuff.ID？它知道东西的意思吗？
var a = parseInt($('#caption_#{id} .quantity-have').text());
var b = parseInt($('#caption_#{id} .quantity-needed').text());
$("#caption_#{id} .progressbar").progressbar({value: a, max: b });