Question

I am using jQuery Raty Plugin which is a star rating plugin and it ss working fine .

Here is my code

 $('#star').raty({
            path: '/Content/RatingPlugin/',
            numberMax: 5,
            score: function () {
                return $(this).attr('data-score');
            }
        });

HTML

<div id="star" data-score="@Model.Company.Rating"></div>

Now there are 2 problems, suppose when my page load @Model.Company.Rating value is 4 it will show 4 stars on which is right but if any one click on the third star it will off that 4th star and then only 3 stars will be on. I want that if a user click on any star then in javascript I get the value of that star and store that on database but it should not takle effect on user side I mean after clicking of user amount of on stars will remain same.

If you need any other detail please let me know .

Answer 1

http://jsfiddle.net/DerekL/bp2mW/18/

$('#star').raty({
    score: 3,                                                    //default score
    starOn: "http://wbotelhos.com/raty/lib/img/star-on.png",
    starOff: "http://wbotelhos.com/raty/lib/img/star-off.png",
    readOnly: true                                               //read only
});

$("#star > img").click(function(){
    var score = $(this).attr("alt");                             //record clicked
    alert(score);                                                // value of the
    //save to database                                              star
});

Learn more about readonly on the plugin’s docs.