Question

What I want to do is some how only apply the jquery function below to the class for the comment that’s just been posted. Instead the function is being applied to all classes.

Here is the code I’m currently using:

controller:

class CommentsController < ApplicationController

    def create

         @comment = Micropost.find(params[:comment][:micropost_id]).comments.build(params[:comment])
           respond_to do |format|
                 if @comment.save

                    unless params[:comment][:recipient].blank? # this will be blank when current user is commenting/replying on their own wall
                    recipient = User.find(params[:comment][:recipient])
                    UserMailer.new_wall_post_comment_notification(recipient, current_user).deliver if recipient.email_notification == 1 
                    end
                    format.js   { render :post_comment }
                    else
                    format.js   { render :form_errors }
                    end
           end
    end

end

jquery:

$.ajax({
    success: function(){
        $('.post_container').append('test <br />');
    }
});
<% sleep 1 %>

It is similar to the code I used for my single main micropost form but with this there are several comments that use the same class and so test is being applied to all post_containers rather than the one the post was just made to. “test” text will eventually be replaced with the div that holds the actual comments users post.

Normally I would use “this” but that won’t work here.

HTML:

<div class="post_content">
    <div class="post_container">
        <div class="userNameFontStyle">
            <%= link_to current_users_username.capitalize, current_users_username %> -
            <div class="post_time">
                <%= time_ago_in_words(m.created_at) %> ago.
            </div>
        </div>  
        <%=  simple_format h(m.content) %>
    </div>
    <% if m.comments.any? %>
    <% comments(m.id).each do |comment| %>
    <div class="comment_container">
        <%= link_to image_tag(default_photo_for_commenter(comment), :class => "commenter_photo"), commenter(comment.user_id).username %>
        <div class="commenter_content">
            <div class="userNameFontStyle">
                <%= link_to commenter(comment.user_id).username.capitalize, commenter(comment.user_id).username %> - <%=  simple_format h(comment.content) %>
            </div>
        </div>
        <div class="comment_post_time">
            <%= time_ago_in_words(comment.created_at) %> ago.
        </div>
    </div>
    <% end %>
    <% end %>
    <% if logged_in? %>
    <%= form_for @comment, :remote => true do |f| %>
    <%= f.hidden_field :user_id, :value => current_user.id %>
    <%= f.hidden_field :micropost_id, :value => m.id %>
    <%= f.text_area :content, :placeholder => 'Post a comment...', :class => "comment_box", :rows => 0, :columns => 0 %>
    <div class="commentButtons">         
        <%= f.submit 'Post it', :class => "commentButton" %>
        <div class="cancelButton">
            Cancel
        </div>
    </div>   
    <% end %>
    <% end %>
    </div>
</div>

How would I deal with this?

Kind regards

Answer 1

You could add a class to the container of the particular post that you want to alter, specifically for the purpose of identifying it.

my_post.parent().addClass("fixme");

then later

container = $(".post_container.fixme");
// do stuff
container.removeClass("fixme");