2016-07-17 53 views
1

我試圖更新對帖子的評論,並且我可以使編輯表單部分呈現正確,但嘗試保存時什麼都不做 - 沒有控制檯錯誤,沒有服務器日誌中出現錯誤,並且記錄未保存。rails 4 ajax編輯表單不發射更新

edit.js.erb

$('#comment-<%= @post.id %>-<%= @comment.id %>').find('.comment-content').html("<%= j render partial: 'comments/comment_form', locals: { comment: comment, post: post } %>"); 

的意見/ _comment_form.html.erb

<div class="comment-form col-sm-11"> 
      <%= form_for([post, comment], :remote => true) do |f| %> 
      <%= f.text_area :content, class: "comment_content", id: "comment_content_#{post.id}" %> 
     </div> 

     <div class="col-sm-1"> 
     <%= f.submit "Save", class: "btn btn-primary btn-xs" %> 
     <% end %> 
</div> 

update.js.erb

$('comment-form').hide(); 
$('#comment-<%= @post.id %>-<%= @comment.id %>').find('.comment-content').html('<%= @comment.content %>'); 

的routes.rb

resources :users do 
end 

resources :posts do 
    resources :comments 
end 


class Post < ActiveRecord::Base 
    belongs_to :user 
    has_many :comments, dependent: :destroy 
end 

class User < ActiveRecord::Base 
    has_many :posts, dependent: :destroy 
    has_many :comments, dependent: :destroy 
end 

class Comment < ActiveRecord::Base 
    belongs_to :user 
    belongs_to :post 
end 

下面是單擊edit_post_comment_path鏈接時服務器日誌中的最後一項;從字面上看,當編輯表單中的保存點擊時沒有任何反應,並且update.js.erb中的測試警報不會觸發。

Started GET "/posts/471/comments/30/edit" for 72.231.138.82 at 2016-07-17 01:25:27 +0000 
Processing by CommentsController#edit as JS 
    Parameters: {"post_id"=>"471", "id"=>"30"} 
    User Load (0.4ms) SELECT "users".* FROM "users" WHERE "users"."id" = ? ORDER BY "users"."id" ASC LIMIT 1 [["id", 2]] 
    RailsSettings::SettingObject Load (0.2ms) SELECT "settings".* FROM "settings" WHERE "settings"."target_id" = ? AND "settings"."target_type" = ? [["target_id", 2], ["target_type", "User"]] 
    Post Load (0.1ms) SELECT "posts".* FROM "posts" WHERE "posts"."id" = ? ORDER BY "posts"."created_at" DESC LIMIT 1 [["id", 471]] 
    Comment Load (0.2ms) SELECT "comments".* FROM "comments" WHERE "comments"."user_id" = ? AND "comments"."id" = ? LIMIT 1 [["user_id", 2], ["id", 30]] 
    Comment Load (0.1ms) SELECT "comments".* FROM "comments" WHERE "comments"."id" = ? LIMIT 1 [["id", 30]] 
    User Load (0.5ms) SELECT "users".* FROM "users" WHERE "users"."id" = ? LIMIT 1 [["id", 2]] 
    Rendered comments/_comment_form.html.erb (1.2ms) 
    Rendered comments/edit.js.erb (13.8ms) 
Completed 200 OK in 102ms (Views: 34.4ms | ActiveRecord: 1.7ms) 

我也有類似的創建,銷燬以及是否可以正常觸發自定義操作(包括方法的update_attributes),所以我不知道爲什麼這種形式無法提交。任何幫助表示讚賞,我對js非常陌生。

更新與評論控制器操作:

class CommentsController < ApplicationController 
    before_action :set_post 
    before_action :user_signed_in?, only: [:create, :destroy] 
    before_action :authenticate_user!, only: [:create, :edit, :new, :destroy, :update] 
    before_action :correct_user, only: [:edit, :update, :destroy] 
    ... 

    def edit 
    @comment = Comment.find(params[:id]) 
    respond_to do |format| 
     format.js { render 'comments/edit', locals: {comment: @comment, post: @post } } 
    end 
    end 

    def update 
    @comment = Comment.find(params[:id]) 
    respond_to do |format| 
     format.js 
    end 
    if @comment.update_attributes(comment_params) 
     @comment.toggle!(:edited) 
     flash[:success] = "Comment edited!" 
     redirect_to root_path 
    else 
     render 'edit' 
    end 
    end 

    private 

    def comment_params 
    params.require(:comment).permit(:content, :user_id, :post_id) 
    end 

    def set_post 
    @post = Post.find(params[:post_id]) 
    end 

    def correct_user 
    @comment = current_user.comments.find_by(id: params[:id]) 
    redirect_to root_url if @comment.nil? 
    redirect_to root_url if @comment.userlocked? 
    end 

end 

我已經更新與編輯表單:方法=>:放,沒有效果,並感謝錯字抓@Emu。

+0

能你發佈你的評論控制器 – mrvncaragay

+0

你必須在你的控制器上渲染js' – uzaif

+0

@ Marv-C,只需添加它即可。 @uzaif,你能再解釋一下在評論控制器中將如何/在哪裏添加render js?這是我第一次嘗試用ajax渲染表單。 –

回答

0

正如您所提交的編輯表單,你應該定義方法form這樣的:

<%= form_for([post,comment ], :remote=>true, :method => :put) do |f| %> 

此外,在update.js.erb以下行缺少"." or "#"

$('.comment-form').hide();