jquery iterating collection with

Question

I have a post index page.

On clicking the a given post's show comment button, the comments of the post get visible. This is easy since I can use

this

then

find

based on the click location.

//open hidden post comments and replies in post thread

$(document).on('click', '.open-all-post-comments', function (event) {

  var post_id = $(this).data('pid');

  var all_replies = $('#post_' + post_id).find('.post-comment-replies:has(.post-comment-reply)');

  all_replies.show();

  $(this).closest('.open-all-post-comments-row').hide();

});

Now, on page load I'd like to make the the edit dropdown visible for the posts where the post author is the current user. I can't figure out how to go thru all the posts on the page, check if the given data attr equals the current user's id then and make the dropdown visible if so.

Here is the code I have at the moment. How should I change it to make it work?

//checking all posts on the page and show the dropdown if user is the post author



$(document).on("page:change", function() {

  if ($('.post-container').length > 0) {

    if ($('.edit-post-dropdown-button').data('postauthorid') == $('#bodycurrentuser').data('currentuserid')) {

      $('.edit-post-dropdown-button').removeClass('hidden');

    };

  };

});

_post partial (single post's html)

<div class="panel panel-default post-panel" id="post_<%= post.id %>">

  ........

  <li class="dropdown edit-post-dropdown-button hidden" data-postauthorid ="<%= post.user_id%>">

    ......

  </li>

</div>

Answer 1

Try to iterate through each post.I could not test it but something like this should work:

$( '.post-panel' ).each(function( index ) { 
        if ($(this).find('.edit-post-dropdown-button').data('postauthorid') == $('#bodycurrentuser').data('currentuserid')) {
            $(this).find('.edit-post-dropdown-button').removeClass('hidden');
           }
});

jquery iterating collection with

Sign up