Using custom data atribute for rating in RateYo

Question

I have few posts which are loaded from database and in template I set every item to have this structure:

<li class="list-group-item">
    Rating: 
    <div class="movie_rating" data-rating="<%= movie.rating %>"></div>
</li>

However, I can't manage to get value from data-rating attribute and put it in every element:

$(".movie_rating").rateYo(
    {
        rating: $(this).attr("data-rating"),
        fullStar: true,
        readOnly: true
    }
);

I want to set rateYo to different value for every element, but when I set it on one, it's configured for all elements of certain class (for example, if rating is 1 for first element, it will be 1 for all elements).

Answer 1

Problem is solved - I used .each() instead of .rateYo() for all elements.

$(".movie_rating").each( function() {
    var rating = $(this).attr("data-rating");
    $(this).rateYo(
        {
            rating: rating,
            fullStar: true,
            readOnly: true
        }
    );
});

Answer 2

this is included in the v2.3.2 of the plugin , you can specify the above options by doing

    <div class="movie_rating"
         data-rateyo-rating="<%= movie.rating %>"
         data-rateyo-full-star="true"
         data-rateyo-read-only="true"></div>

Answer 3

Here is a solution using the data method:

$('.movie_rating').each(function () {
    var rating = $(this).data('rating');
    $(this).rateYo({rating: rating});
});