无法使用 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" 时,它会重定向到新页面而不是弹出模式,甚至无法创建评论。

请帮忙。

  1. 创建一个部分用于显示评论表单。
  2. 渲染此部分以 post 将页面显示为隐藏。
  3. 显示隐藏的部分。

示例:

<%= 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。