Ruby on rails 在Rails 4中使用twitter引导模式作为视图？

有没有人知道一个gem可以让我轻松地实现一个动作作为一个模态，而不必在每个页面上都包含模态标记

例如，我希望我的一个控制器的“新建”操作始终处于模态

基本上，我希望能够将动作呈现为一个模态，这样我就可以去了

def new
  render layout: "modal"
end

当我在这里呈现

布局

时，实际上我仍然希望加载主应用程序布局，但我还希望另一个嵌入布局（不必在视图中使用变量和呈现部分），它将包装所有必需的

.modal

，

.modal对话框

，在我的新的.html.erb模板中，

.modal content

围绕代码进行div，这当然类似于

<div class="modal-header">
  <h4>Yay!</h4>
</div>
<div class="modal-body clearfix">
  <p>Seamless modals rock!</p>
</div>

耶！
无缝模态摇滚

任何指向此操作的链接都不会有什么异常，不需要添加

数据切换

等，您也可以通过手动输入url来访问该操作，因为当您

呈现布局时：“modal”

rails还包括

$（'#myModal'）。modal（'show'））

包装在一个

on.load

函数或类似的函数中，页面加载时启动您的模式。这可以很好地与TurboLink配合使用

这是一个非常具体的例子，但我认为可能已经有了类似的东西。我可能要求太多了

所有这些模式操作都在登录的未索引内容中，所以我认为这对SEO来说并不重要

更新

此后，我决定，从用户体验的角度来看，我想要的东西并不能很好地发挥作用，因为我离首选解决方案越近，出现的奇怪现象就越多，例如：

• 如果我访问这个动作，模态会自动触发，但是模态后面当然没有任何东西。单击“取消”或“关闭”按钮时会发生什么情况
• 当我在模式中提交表单并将其发回同一个操作时，它肯定会很好地显示所有错误，而无需编写javascript，但与此同时，整个模式消失并重新出现

---

其中一些问题可以通过使用TurboLink和添加大量额外选项（如重定向和背景视图）来解决，但这可能需要花费比添加新模态所节省的时间更多的时间来处理。

您对模态的工作方式感到困惑：

---

情态动词

Modals只不过是页面上的DIV元素（使用CSS/JS使它们看起来“悬停在”其他内容上）

不管是不是自举，它们仍然只是一个元素，必须像其他任何东西一样呈现到布局中。不同之处在于，您需要使用CSS&JS调用它们，使它们看起来是浮动的

---

代码

如果要在模式中显示

新的
操作，请执行以下操作：

向新操作发送远程（ajax）请求（从链接）
在没有布局的情况下处理ajax请求
在原始ajax请求中，在模态元素中呈现返回的数据
在这里：

#app/views/your/action.html.erb
#app/views/your/new.html.erb
耶！
无缝模态摇滚

#app/controllers/your_controller.rb
def新
回应待办事项|格式|
format.html{render layout:！request.xhr？}#如果是ajax，则呈现裸html
结束
结束
#app/assets/javascripts/application.js.erb
$（“模态路径”）。在（“单击”，函数（）上{
$.ajax({
url:$（this.attr（“href”）；
成功：功能（数据）{
$（数据）。附录（“正文”）；
$（'myModal'）.modal（'show'）；
}
});
});

如果每次渲染布局时都试图将其嵌入到另一个布局中，则只需将render调用到布局中以嵌入到主布局中即可。我想这就是你想要的。嗨@ITNinja谢谢你的评论-尽管我不确定我是否理解你的意思？您能提供一个简单的代码示例吗？谢谢Rich，您的解决方案基本上就是我已经使用过的。我确切地知道情态动词是什么以及它们是如何工作的。你不理解我的问题，这是我的错，因为我说得不够好。我对我的问题做了一些修改，并添加了一个更新。
#app/views/your/action.html.erb
<%= link_to "New", new_modal_path, id: "modal_path" %>

#app/views/your/new.html.erb
<div id="myModal">
    <div class="modal-header">
        <h4>Yay!</h4>
    </div>
    <div class="modal-body clearfix">
        <p>Seamless modals rock!</p>
    </div>
</div>

#app/controllers/your_controller.rb
def new
    respond_to do |format|
        format.html { render layout: !request.xhr? } #renders naked html if ajax
    end
end

#app/assets/javascripts/application.js.erb
$("#modal_path").on("click", function() {
    $.ajax({
        url: $(this).attr("href");
        success: function(data) {
            $(data).appendTo("body");
            $('#myModal').modal('show');
        }
    });
});