在Rails 3中使用JQuery进行动态显示

我正在加载@products的集合，这些集合不断更改我实时计算的属性。我不想为初始页面索引上的所有@products执行所有计算。相反，我只想执行并显示悬停在图像上的计算结果。在Rails 3中使用JQuery进行动态显示

我首先创建了jQuery调用来显示一个弹出框，包含计算在产品的每一个产品/ index.html.erb这样的：

产品/ index.html.erb

<script type="text/javascript"> 
    jQuery(function($){ 
    <% @products.each do |product| %> 
     $('#calc_<%= product.id %>').hover(function() { 
     $('#pid_<%= product.id %>').show() 
     }, function() { 
     $('#pid_<%= product.id %>').hide() 
     }); 
    <% end %> 
}); 
</script> 

<table class='list'> 
    <%= render :partial => "products/product", :collection => @products %> 
</table>

我_product.html.erb：

<%= image_tag('/images/info.png', :id => "calc_#{product.id}") %> 
<div class='pid_display' id='pid_<%=product.id %>'></div>

我的CSS：

.pid_display { 
    height: 80px; 
    width: 200px; 
    background-color: #eee; 
    display: none; 
    padding-top: 8px; 
    position: absolute; 
}

我试图调用执行在这样的product.id计算的页面（虽然我不知道这是否是正确的）：

jQuery.ajax("products/calculations/<%= product.id %>");

当我尝试将调用合并计算页面，所以它在弹出框中显示结果，都是火。换句话说，会出现一个弹出框，日志显示计算是从products_controller执行的。

如何结合这两个调用来显示弹出框内的计算结果？

来源

2013-02-22 Dawn Green

感谢我的朋友，马库斯，在这里，http://tech.thereq.com/post/16479390885/loading-page-content-via-ajax-in-rails-3-1指着我。使用“加载”方法：

jQuery(function($){ 
    <% @products.each do |product| %> 
    $('#calc_<%= product.id %>').hover(function() { 
     $('#pid_<%= product.id %>').show().load('products/calculations/<%= product.id %>'); 
    }, function() { 
     $('#pid_<%= product.id %>').hide() 
    }); 
    <% end %> 
});

来源

2013-02-25 16:07:52

您可以使用attr_accessible来确定模型对@products的第一个元素具有哪些属性并将其保存在数组中。

然后就可以使用这些属性使用product.method来从对象中的值（“属性”）

来源

2013-02-23 09:21:15

保罗，我不知道这是如何帮助我执行计算**只有**时，将鼠标悬停在图像上，然后在该框中显示它们。你能澄清吗？ – 2013-02-24 17:42:46

在Rails 3中使用JQuery进行动态显示

回答

相关问题