更新的Rails使用远程=真

Question

我有这样的代码在Rails视图从JS查看“在我的控制器中。此方法将更新数据库，并设置一个实例变量@newstate =“FAV”

在make_fav.js.erb我可以看到，这个实例变量被设置

<% puts "Newstate is #{@newstate}" %> 

在我index.html.erb

，我有

<td id='<%= "favourite-#{product.id}" %>' > 
    <% if current_user.products.exists?(product.id) %> 
     <i class="fa fa-star" %></i> 
    <% else %> 
     <i class="fa fa-star-o" %></i> 
    <% end %> 
</td> 

现在我应该如何（在make_fav.js.erb）更新ID的TD “最爱 - ＃{} product.id”，以反映@newstate变量？

我曾尝试之类的东西

<% @key = "#favourite-#{@product.id}" %> 
<% x = "<i class='fa fa-star' id='favourite-#{@product.id}></i>" %> 

$('<%= @key %>').html("<%= escape_javascript (x) %>"); 

但你可以看到，我在当它涉及到JavaScript中的损失......

基本上，我要更新的内容

<i class="fa fa-star" %></i> 

如果@newstate是 “我的最爱”，以及其他

<i class="fa fa-star-o" %></i> 

我觉得我很近，但会很感激任何帮助！

此外，如果有更好的/更“高尚的”做法，我想听听它。

Answer 1

您的推理与解决方案并不相距太远。看起来您正在计算您想要查找的元素的id，但您想要更新该ID中的i元素。所以你的make_fav.js.erb的一个小改变可以做到这一点。尝试更改为：

(function() { 
    var id = "#favourite-<%= @product.id %> i"; 
    if ($(id).hasClass('fa-star-o')) { 
    $(id).addClass('fa-star').removeClass('fa-star-o'); 
    } else { 
    $(id).addClass('fa-star-o').removeClass('fa-star'); 
    } 
})(); 

在此方案中，我们首先定义你想找到（这是favourite-id内i和交换类（如果它是fa-star它去fa-star-o，副主席i的选择反之亦然）。

注意，而不是在这种条件下使用$(id).hasClass('fa-star-o')，你应该使用数据的新状态（我只是不知道它是怎么会看起来像你的具体情况），但make_fav.js.erb可能看起来像：

(function() { 
    var id = "#favourite-<%= @product.id %> i"; 
    <% if current_user.products.exists?(product.id) %> 
    $(id).addClass('fa-star').removeClass('fa-star-o'); 
    <% else %> 
    $(id).addClass('fa-star-o').removeClass('fa-star'); 
    <% end %> 
})(); 

这将是首选方式，因为您不依赖于UI的状态，而是依赖于数据的状态。