无法使用 rails 应用程序获取弹出模式对话框
Couldn't get popup modal dialog with rails application
我有 2 个模型 Post 和评论,其中 Post 有很多评论和评论 belongs_to Post。
为该帖子创建帖子和评论一切正常。
现在我有一个要求,当我在 posts/show 页面中单击 "create new comment" 时,我想在模态中显示 comments/_form。
comments_controller.rb:
class CommentsController < ApplicationController
before_action :set_comment, only: [:show, :edit, :update, :destroy]
# GET /comments
# GET /comments.json
def index
@comments = Comment.all
respond_with(@comments)
end
# GET /comments/1
# GET /comments/1.json
def show
respond_with(@comments)
end
# GET /comments/new
def new
@post = Post.find(params[:post_id])
@comment = @post.comments.build
end
# GET /comments/1/edit
def edit
@post = Post.find(params[:post_id])
end
# POST /comments
# POST /comments.json
def create
@post = Post.find(params[:post_id])
@comment = @post.comments.create(comment_params)
respond_to do |format|
if @comment.save
format.html { redirect_to(@comment, :notice => 'Article was successfully created.') }
format.xml { render :xml => @comment, :status => :created, :location => @comment }
format.js
else
format.html { render :action => "new" }
format.xml { render :xml => @comment.errors, :status => :unprocessable_entity }
format.js
end
end
end
# PATCH/PUT /comments/1
# PATCH/PUT /comments/1.json
def update
@post = Post.find(params[:post_id])
@comment.update(comment_params)
redirect_to post_path(@post)
end
# DELETE /comments/1
# DELETE /comments/1.json
def destroy
@comment.destroy
respond_to do |format|
format.html { redirect_to comments_url, notice: 'Comment was successfully destroyed.' }
format.json { head :no_content }
end
end
private
# Use callbacks to share common setup or constraints between actions.
def set_comment
@comment = Comment.find(params[:id])
end
# Never trust parameters from the scary internet, only allow the white list through.
def comment_params
params.require(:comment).permit(:commenter, :description)
end
end
posts/show.html.erb:
<%= link_to 'New Coment', new_post_comment_path(@post), :id => 'create_comment' %>
comments/new.html.erb:
<div id="content">
<h1>New Comment</h1>
<%= render 'form' %>
</div>
comments/_form.html.erb:
<%= form_for([@post, @comment], :remote => true) do |f| %>
<div class="field">
<%= f.label :commenter %><br>
<%= f.text_field :commenter %>
</div>
<div class="field">
<%= f.label :description %><br>
<%= f.text_field :description %>
</div>
<div class="actions">
<%= f.submit %>
</div>
<% end %>
comments/create.js.erb:
<%- if @comment.errors.any? %>
console.log('Error');
$('#dialog-form').html('<%= escape_javascript(render('form')) %>');
<%- else %>
console.log('Created');
$('#dialog-form').dialog('close');
$('#dialog-form').remove();
$('table').append('<%= escape_javascript(render(@comment)) %>');
<%- end %>
我不知道我哪里做错了。当我点击 "create comment" 时,它会重定向到新页面而不是弹出模式,甚至无法创建评论。
请帮忙。
- 创建一个部分用于显示评论表单。
- 渲染此部分以 post 将页面显示为隐藏。
- 显示隐藏的部分。
示例:
<%= link_to 'Show Modal', "#", data: {toggle: "modal", target: "#modal"} %>
隐藏部分
<div class="modal hide fade" id="modal" title="My modal">
/* your comment form */
/* render comment form */
</div>
只需确保目标是您隐藏的部分 ID。
我有 2 个模型 Post 和评论,其中 Post 有很多评论和评论 belongs_to Post。 为该帖子创建帖子和评论一切正常。
现在我有一个要求,当我在 posts/show 页面中单击 "create new comment" 时,我想在模态中显示 comments/_form。
comments_controller.rb:
class CommentsController < ApplicationController
before_action :set_comment, only: [:show, :edit, :update, :destroy]
# GET /comments
# GET /comments.json
def index
@comments = Comment.all
respond_with(@comments)
end
# GET /comments/1
# GET /comments/1.json
def show
respond_with(@comments)
end
# GET /comments/new
def new
@post = Post.find(params[:post_id])
@comment = @post.comments.build
end
# GET /comments/1/edit
def edit
@post = Post.find(params[:post_id])
end
# POST /comments
# POST /comments.json
def create
@post = Post.find(params[:post_id])
@comment = @post.comments.create(comment_params)
respond_to do |format|
if @comment.save
format.html { redirect_to(@comment, :notice => 'Article was successfully created.') }
format.xml { render :xml => @comment, :status => :created, :location => @comment }
format.js
else
format.html { render :action => "new" }
format.xml { render :xml => @comment.errors, :status => :unprocessable_entity }
format.js
end
end
end
# PATCH/PUT /comments/1
# PATCH/PUT /comments/1.json
def update
@post = Post.find(params[:post_id])
@comment.update(comment_params)
redirect_to post_path(@post)
end
# DELETE /comments/1
# DELETE /comments/1.json
def destroy
@comment.destroy
respond_to do |format|
format.html { redirect_to comments_url, notice: 'Comment was successfully destroyed.' }
format.json { head :no_content }
end
end
private
# Use callbacks to share common setup or constraints between actions.
def set_comment
@comment = Comment.find(params[:id])
end
# Never trust parameters from the scary internet, only allow the white list through.
def comment_params
params.require(:comment).permit(:commenter, :description)
end
end
posts/show.html.erb:
<%= link_to 'New Coment', new_post_comment_path(@post), :id => 'create_comment' %>
comments/new.html.erb:
<div id="content">
<h1>New Comment</h1>
<%= render 'form' %>
</div>
comments/_form.html.erb:
<%= form_for([@post, @comment], :remote => true) do |f| %>
<div class="field">
<%= f.label :commenter %><br>
<%= f.text_field :commenter %>
</div>
<div class="field">
<%= f.label :description %><br>
<%= f.text_field :description %>
</div>
<div class="actions">
<%= f.submit %>
</div>
<% end %>
comments/create.js.erb:
<%- if @comment.errors.any? %>
console.log('Error');
$('#dialog-form').html('<%= escape_javascript(render('form')) %>');
<%- else %>
console.log('Created');
$('#dialog-form').dialog('close');
$('#dialog-form').remove();
$('table').append('<%= escape_javascript(render(@comment)) %>');
<%- end %>
我不知道我哪里做错了。当我点击 "create comment" 时,它会重定向到新页面而不是弹出模式,甚至无法创建评论。
请帮忙。
- 创建一个部分用于显示评论表单。
- 渲染此部分以 post 将页面显示为隐藏。
- 显示隐藏的部分。
示例:
<%= link_to 'Show Modal', "#", data: {toggle: "modal", target: "#modal"} %>
隐藏部分
<div class="modal hide fade" id="modal" title="My modal">
/* your comment form */
/* render comment form */
</div>
只需确保目标是您隐藏的部分 ID。