turbolinks与bootstrap模式的问题

Question

我做这样的模态:

显示模态的链接:

<%= link_to "versão resumida", resumed_rep_life_animal_path(animal, :partial => true), 'data-toggle' => 'modal', 'data-target' => '#myModal', 'data-no-turbolink' => true %>

模态html本身:

<div class="modal hide fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-body"></div>
  <div class="modal-footer">
    <button class="btn btn-primary" data-dismiss="modal" aria-hidden="true">Fechar</button>
  </div>
</div>

但是,data-no-turbolink不按预期工作.如果我刷新页面,它可以正常工作,但是,当我使用turbolinks浏览页面时,看起来就像是data-no-turbolink被忽略了.

难道我做错了什么？我有一些模态,如我的应用程序中的示例,不想删除它们,也不想删除turbolinks ...

提前致谢.

Answer 1

正如davydotcom所说,模态不起作用的原因是因为它们必然$(document).ready代替$(document).on('page:change'),而这就是turbolinks所使用的.

jquery-turbolinks gem将使它成为现成的调用也将响应turbolink的页面:更改调用.

第1步:将gem添加jquery-turbolinks到您的Gemfile中.

第2步:按以下顺序将其添加到JavaScript清单文件中:

//= require jquery
//= require jquery.turbolinks
//= require jquery_ujs
//
// ... your other scripts here ...
//
//= require turbolinks

第3步:重新启动服务器.繁荣!

Answer 2

data-no-turbolinks 不是这里的问题......

看起来开箱即用的 bootstrap js 仅监视 document.ready，并且 bootstrap JS 可能需要修改以检查 page:load

看222行

这只会在包含引导程序的第一个请求时触发。它也需要修改为在 page:load 上触发。

我可以提出的一个建议是使用 gem 'twitter-bootstrap-turbo' 来获取引导程序。这是twitter-bootstrap-rails的一个分支，添加了 Turbolinks 处理程序。