Rails 4 - Bootstrap模态形式 - 设置

时间:2016-08-29 00:57:16

标签: ruby-on-rails ruby twitter-bootstrap routes bootstrap-modal

我正在尝试按照this教程在我的Rails 4应用程序中设置包含嵌套表单的模式。

我有Project和Invite的模型。协会是:

Project has_many :invites
Invite belongs_to :project

在我的views projects文件夹中,我创建了一个名为new_invitation.html.erb的部分

<div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
    <h3 id="myModalLabel">Modal header</h3>
  </div>
  <div class="modal-body">
    **here comes whatever you want to show!**
  </div>
  <div class="modal-footer">
    <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
    <button class="btn btn-primary">Save changes</button>
  </div>

我正在尝试从我的项目展示页面链接到该页面,该页面包含:

<%= link_to 'Invite Team Mates', new_invitation_path,  {:remote => true, 'data-toggle' =>  "modal", 'data-target' => '#modal-window'}  %>
     <div id="modal-window" class="modal hide fade" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"></div>

在我的app / javascripts文件夹中,我有一个名为new_invitation.js.erb的文件,其中包含:

$("#modal-window").html("<%= escape_javascript(render 'project/new_invitation') %>");

在我的应用程序中,我有:

//= require bootstrap/modal

(与教程略有不同,因为我使用rails 4和bootstrap sass)。

在我的项目控制器中,我有:

def new_invitation
    respond_to do |format|
      format.html
      format.js
    end
end

我将路线从put改为get动作(虽然我不理解这一步):

 resources :projects do
    member do
    get "new_invitation" => "projects/new_invitation", as: :new_invitation
    end
    resources :invites
  end

上述尝试中的链接路径存在问题。我不知道为什么,但错误消息建议使用:

new_invitation_project_path 

当我尝试时,我收到一条错误消息:

undefined method `render' for #<#<Class:0x007fa2b2138bf0>:0x007fa2a04a1308>

我在教程的评论中看到有人尝试将js文件重写为:

$("#modal-window").html("<%= escape_javascript(render :partial => 'project/new_invitation') %>");

我尝试了但得到了相同的错误消息。任何人都可以看到我可能需要做些什么来复制教程似乎对其他用户的成功吗?

1 个答案:

答案 0 :(得分:1)

问题在于此处定义的成员路线。

resources :projects do
  member do
    get "new_invitation" => "projects/new_invitation", as: :new_invitation
end

生成的成员路线是

new_invitation_project GET  /projects/:id/new_invitation(.:format)  projects/new_invitation#new_invitation

控制器操作projects/new_invitation#new_invitation甚至不存在。

映射应采用controller#action格式。所以,它应该是

get "new_invitation" => "projects#new_invitation", as: :new_invitation

甚至更好,

get :new_invitation

使用rake routes | grep invitation查看生成的路线。

new_invitation操作中,您正在呈现js响应。因此,rails会在new_invitation.js.erb内寻找app/views/projects。您必须将文件从app/javascripts移动到正确的位置,如上所述。

您的new_invitation.js.erb代码存在另一个问题。 _new_invitation.html.erb位于views/projects/目录中。所以,您应该将其修改为

$("#modal-window").html("<%= escape_javascript(render 'projects/new_invitation') %>");

否则,因为它在Missing Template目录中查找模板,您将收到project错误。确保_new_invitation.html.erb目录中已app/views/projects部分定义。

要渲染模态,您需要使用modal方法显示模态。

$('#modal-window').modal('show');

您的new_invitation.js.erb应该是这样的。

$("#modal-window").html("<%= escape_javascript(render 'projects/new_invitation') %>");
$('#modal-window').modal('show');

希望这有帮助!