开发者

Rails3 + jQuery: Ajax response messed up

开发者 https://www.devze.com 2023-03-04 04:02 出处:网络
I\'m trying to get along with Rails 3 and some Ajaxification of my app with jQuery. Therefore, when a user is writing a comment, the comment should be inserted via Ajax after hitting the submit button

I'm trying to get along with Rails 3 and some Ajaxification of my app with jQuery. Therefore, when a user is writing a comment, the comment should be inserted via Ajax after hitting the submit button.

Problem is: The Ajax response contains the whole generated html of my application.haml. I'm having no clue, how to get rid of this html and only get the intended response written in the related create.js.erb file.

Here's my comments controller:

class CommentsController < ApplicationController

  def new
    @comment = Comment.new
  end

  def create
    @article = Article.find(params[:article_id])
    @comment = current_user.comments.build(params[:comment])
    @comment.article_id = @article.id
    respond_to do |format|
      if @comment.save
        format.html
        format.js

      else
        format.html
        format.js
      end
    end
  end

end

The form (in HAML) for comments is looking like this:

  #article_write_comment
    %h2 Write a comment
    #article_write_comment_form
      %p Comments are limited to 1000 chars.
      = form_for([@article, @article.comments.build], :remote => true) do |f|
        .field
          = f.text_area :body, :rows => 10, :cols => 50
        .actions
          = f.submit "Submit"

My create.js.erb file is placed in views/comments:

$('#article_comments').append('<%= escape_javascript(render(@comment)) %>');

The comment partial (views/comments/_comment.haml), that should be appended looks like this:

.comment
  = gravatar_for comment.user, :size =>开发者_如何转开发 48
  %p
    %b
      = comment.user.name
      said: 
    = time_ago_in_words(comment.created_at)
    ago
  %p
    = simple_format(comment.body)

Finally, the sent ajax post after hitting submit is:

authenticity_token  e2rvcKyjPEx8f31U2vemxCGMfVJzxvqTO+03OCAsNkw=
comment[body]   Test Test Test
commit  Submit
utf8    ✓

But instead of this kind of response:

$('#article_comments').append('<%= escape_javascript(render(@comment)) %>');

I'm getting this kind of response with the html code of the site: (Shortened the content of the divs for less distraction)

<!DOCTYPE html>
<html>
  <head>
  </head>
  <body>
    <div id='content'>
      <div id='header'>
      </div>
      <div id='container'>
        $('#article_comments').append('<div class=\'comment\'>\n  <img alt=\"Alex Gieche\" class=\"gravatar\" src=\"http://gravatar.com/avatar/66d7f7aefd1f45ea810cb3f524cc1780?size=48\" />\n  <p>\n    <b>\n      Alex Gieche\n      said:\n    <\/b>\n    less than a minute\n    ago\n  <\/p>\n  <p>\n    <p>Test Test Test<\/p>\n  <\/p>\n<\/div>\n');
      </div>
      <div id='sidebar'>
      </div>
      <div id='footer'>
      </div>
    </div>
  </body>
</html>

The comment is not getting appended to the div (but is written to the database). So, how can I fix this? Thanks for looking!


Ok, thanks for looking, I found the solution. In the comments controller,I had to add the following hash to format.js to prevent rendering the layout in the response:

class CommentsController < ApplicationController

  def new
    @comment = Comment.new
  end

  def create
    @article = Article.find(params[:article_id])
    @comment = current_user.comments.build(params[:comment])
    @comment.article_id = @article.id
    respond_to do |format|
      if @comment.save
        format.html
        format.js {render :layout=>false}
      else
        format.html
        format.js {render :layout=>false}
      end
    end
  end

end
0

精彩评论

暂无评论...
验证码 换一张
取 消