在rails中使用Twitter引导jquery模式链接到另一个页面

在rails中使用Twitter引导jquery模式链接到另一个页面,jquery,ruby-on-rails,twitter-bootstrap,Jquery,Ruby On Rails,Twitter Bootstrap,我只是希望这个模式出现并显示另一个页面的内容,但我无法让它工作,因为我是Jquery新手。有没有办法修改下面的代码,以便在模式弹出窗口中显示“/contact/”的内容 ---------- # this content is on http://myurl.com/contact/ <div style="display: none;" id="myModal" class="modal hide fade"> <p>this is my email app her

我只是希望这个模式出现并显示另一个页面的内容,但我无法让它工作,因为我是Jquery新手。有没有办法修改下面的代码,以便在模式弹出窗口中显示“/contact/”的内容

----------
# this content is on http://myurl.com/contact/
 <div style="display: none;" id="myModal" class="modal hide fade">
 <p>this is my email app here...</p>
</div>
----------
# this is the button on a 'show' page where i want someone to push to bring up the contents of the above page in the modal.
<a data-toggle="modal" href="#myModal" class="btn btn-primary btn-large">Launch Email</a>
----------
#此内容已打开http://myurl.com/contact/
这是我的电子邮件应用程序

---------- #这是“显示”页面上的按钮,我希望有人按下该按钮,在模式中显示上述页面的内容。
好的,这里的诀窍是“其他页面”可能是Rails控制器操作的结果,该操作通常会在单独的URL上呈现页面,对吗?然而,bootstrap假设当您单击链接时,其HTML已经存在于当前页面上

那么如何处理呢?您需要通过AJAX发出控制器请求(
link\u to…:remote=>true
是一个很好的开始),并更改控制器,使其内容添加到当前页面某个位置的div中。完成后,您上面的代码或类似的东西(或类似于引导页面上记录的内容)将执行您想要的操作

编辑:添加特定示例,在我的示例中,以引导模式打开编辑用户页面(使用Desive gem进行身份验证):

app/views/designe/registrations/\u edit.html.erb:

<div class="modal hide fade in" id="user-edit">
  <div class="modal-header">
    <button class="close" data-dismiss="modal">x</button>
    <h2>Edit User</h2>
  </div>

  <%= form_for(resource, :as => resource_name, :url => registration_path(resource_name), :html => {:method => :put}) do |f| %>
    <div class="modal-body">
      <%= devise_error_messages! %>

      <div>
        <%= f.label :name %><br/>
        <%= f.text_field :name %>
      </div>

      <div>
         <%= f.label :email %><br/>
        <%= f.email_field :email %>
      </div>

      <div>
        <%= f.label :password %> <i>(leave blank if you don't want to change it)</i><br/>
        <%= f.password_field :password, :autocomplete => "off" %>
      </div>

      <div>
        <%= f.label :password_confirmation %><br/>
        <%= f.password_field :password_confirmation %>
      </div>

      <div>
        <%= f.label :current_password %> <i>(we need your current password to confirm your changes)</i><br/>
        <%= f.password_field :current_password %>
      </div>
    </div>

    <div class="modal-footer">
      <%= f.button "Update", :class => "btn btn-primary", :data => { :dismiss => "modal"} %>
      <a href="#" class="btn" data-dismiss="modal">Close</a>
    </div>
  <% end %>
</div>
$("#main").before("<%= escape_javascript(render "edit", :formats => [:html]) %>");
$("#user-edit").modal();
以及从任何页面调用它的链接(我现在在nav中有:

<li><%= link_to "Edit Account", edit_user_registration_path, :remote => true %></li>
  • 正确%>

  • @amitamb-不,我还没有尝试IFrame,但我已经看到了搜索的解决方案,所以我想我会先尝试一下,因为这似乎是最简单的。你是对的-这是一个类似于联系人页面的电子邮件表单,我想以一种模式呈现。我只想允许一个用户通过表单向另一个用户发送电子邮件。谢谢提交但不幸的是,我是一个noob,不知道该怎么做。我使用了:remote=>true,但对于“将控制器更改为将其内容添加到div”我不知道你的意思。有人有一个逐步的例子来说明这一点吗?:)