ruby-on-rails – 使用gagejs和rails更新SVG

2024年2月3日 155次阅读

我正在试验Raphael,SVG和rails.我希望量具能够动态更新,作为各种任务通过完成按钮划掉的各种进度指示器.

完成任务/创建总任务之类的东西.

附件是浏览器中的视图,下面是显示页面.

 <h1 class="page-header"> Getting it up</h1>
 <div class="well span9 offset2">
   <h2 class="page-header"><%= @list.name %></h2>
   <h2 class="lead"><%= @list.description %></h2>  
   <div class="pull-right" id="smallbuddy" style="width:340px; height:200px;"></div>

   <h3>Still Not Finished</h3>

   <ul>
     <% @list.tasks.incomplete.each do |task| %> 
     <li style="list-style:none"><%= task.description %> <%= button_to "Completed", complete_task_path(@list.id,task.id), :class =>"btn-mini" %></li>
     <% end %>
   </ul>
   <hr>
   <h3>Finished</h3>
   <ul id="completed">
     <% @list.tasks.completed.each do |task| %> 
     <li style="list-style:none; opacity:.5; text-decoration:line-through;"><em><%= task.description %></em></li>
     <% end %>
   </ul>

   <hr>
   <%= form_for [@list, @list.tasks.new] do |form| %>
   <p><%= form.text_field :description %><%= form.submit %></p>
   <% end %>
 </div>    

 <span class="btn affix"><%= link_to "Back to all Installs", lists_url %></span>
 <div>

 </div>

 <script>
   var g = new JustGage({
     id: "smallbuddy", 
     value: 27, 
     min: 0,
     max: 100,
     title: "Until Complete"
   }); 

 </script>

我需要操纵Raphael Lib吗？还是justgagejs lib？

仍在努力通过它,但一些经验丰富的建议指出我如何实现这一点的正确方向将是有帮助的.提前致谢.

最佳答案 您需要使用rails控制器来响应JS请求,请阅读以下内容：
Having trouble rendering Javascript in Rails问题.

这样你就可以在你的控制器返回的JS中更新你的仪表.

点赞