jQuery更新后Ruby on Rails/Twitter Bootstrap Popover无法正常工作 [英] Ruby on Rails/Twitter Bootstrap Popover not working correctly after jQuery update

问题描述

我正在Rails 3中使用Twitter引导弹出窗口.
当我最初加载页面(显示操作)时，弹出窗口可以正常工作.

I'm using Twitter bootstrap popover in Rails 3.
When I initially load the page (show action), the popover works correctly.

我的局部(一个叫另一个)看起来像这样:

My partials (one calls another) look like this:

<span class="solution_votes_stat" id="<%= 'solution_votes_stat_' + sid.to_s %>">
   <%= render :partial => 'solutions/popover', :locals => {:s => s} %>
</span>

_popover.html.erb看起来像这样:

_popover.html.erb looks like this:

<% sid = s.id %>
<% solution_vote_up_count = s.solution_votes.votes_up.count %>

<% all_users_who_voted_up(sid) %>
<span class = "popover-with-html" rel = "popover"  
      data-original-title = "Who likes this" 
      data-content = "<%= render :partial => 'solutions/users_who_voted_up', :locals => {:users_who_voted_up => @users_who_voted_up} %>" 
      id="<%= 'solution_' + sid.to_s + '_up_votes' %>">
  <%= solution_vote_up_count %> 
</span>
<%= solution_vote_up_count==1 ? "Advisor" : "Advisors" %>

这会产生如下的HTML:

This produces HTML like this:

<span class="solution_votes_stat" id="solution_votes_stat_1">
    <span class = "popover-with-html" rel = "popover"  
          data-original-title = "Who likes this" 
          data-content = "<ul><li>Admin</li></ul>" 
          id="solution_1_up_votes">1 
    </span>
       Advisor
</span>

到目前为止，效果很好=>一切正常.
问题是当我尝试使用jQuery更新它时.

So far, so good => it all works correctly.
The problem is when I try to update this with jQuery.

在我的up_votes.js.erb中，我有:

In my up_votes.js.erb, I have:

update_popover = ('<%= escape_javascript(render(:partial => "solutions/popover", :locals => {:s => @solution}))%>');
$('<%= "#solution_votes_stat_"[e-mail]_s %>').html(update_popover);

作为测试，我单击了否决票，然后单击了赞成票.当我查看生成的HTML时，它看起来与上面的HTML完全相同，只是该div现在无法使用(没有弹出窗口)；弹出框仍适用于所有其他div(具有相同的HTML).

As a test, I clicked down vote and then up vote. When I look at the HTML produced, it looks EXACTLY the same as the one above except that it does not work now (no popover) for this div; the popover is still working on all the other divs (with the same HTML).

关于正在发生的事情以及如何解决此问题的任何想法?

Any ideas on what is happening and how to fix this?

更新:看起来正在缓存它.我单击了一下表决以查看div HTML是什么，并且在Chrome开发人员中，HTML正确(0表决，等等)，但是当我查看页面源代码时，它没有改变(1表决，等等).仍不知道该怎么办...我想直接使用jQuery修改数据/属性而不是渲染局部图像?仍然...为什么即使使用缓存的数据，弹出窗口也不再起作用?

UPDATE: It looks like it's caching it. I clicked down votes to look at what the div HTML is and in Chrome developer, the HTML is correct (0 votes, etc) but when I look at the page source, it hasn't changed (1 vote, etc). Still not sure what to do about this yet... I guess use jQuery directly to modify the data/attr instead of rendering the partials? Still... why isn't the popover working any longer, even with cached data?

推荐答案

每个人都想给自己一个快速的踢脚吗? :)好的，我知道了. 在我的solutions.js.coffee(在assets文件夹中)中，当加载文档时，我使用此jQuery来触发此操作:

Ever felt like giving yourself a swift kick?? :) OK, I figured it out. In my solutions.js.coffee (in the assets folder), I had this jQuery to trigger this when document was loaded:

$('.popover-with-html').popover({ html: true })

当我将此行添加到我在下面更新数据的up_votes.js.erb文件中时，它随后重新加载了数据并正确显示. gh-整天都在燃烧-但我想您有时会学到这种方式. :|

When I added this line to my up_votes.js.erb file below where I updated the data, it then reloaded the data and displayed correctly. Ugh - a whole day burned - but I guess you learn that way sometimes. :|

这篇关于jQuery更新后Ruby on Rails/Twitter Bootstrap Popover无法正常工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！