Geek Answers Handbook

JQuery stars rating plugin - disable after voting

I am using the jQuery Stars Rating plugin (v2.61) from http://www.fyneworks.com/jquery/star-rating/ . Everything goes well, but I would like to turn off the stars when the user voted.

Currently, my users select their rating and click the mouse. This updates my database with an AJAX call. The star pattern changes to show the user's choice, with the stars displayed in red. However, if the user throws his mouse at the stars, they are still active and they can cast another vote. I stop this duplicate voting server, but in terms of usability I would like the stars to turn off after the user clicks.

(I think I could reload the div or something using jQuery to show read-only stars, but I was hoping there was some more elegant and simple solution).

Thanks.

+5
source share
5 answers

Why not let the user update their rating? Perhaps their first rating was hasty, and they would like to change it, or maybe they just clicked on the wrong star.

Of course, you need to somehow identify each user and somewhere, in order to store each user rating of each element.

( , , , , , .)

+5

. :

this.rating('disable');

Yey!

+3

"reload the div" , , AJAX. jQuery.ajax, , .

jQuery.ajax({
    type: "POST",
    url: ...
    data: ...
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function(msg) {
        jQuery('.star').attr('disabled', true);
    },
    error: function(XMLHttpRequest, textStatus, errorThrown) {
        displayError();
    }
});

-:

disabled

<input name="star3" type="radio" class="star" disabled="disabled"/> 
<input name="star3" type="radio" class="star" disabled="disabled"/> 
<input name="star3" type="radio" class="star" disabled="disabled" checked="checked"/> 
<input name="star3" type="radio" class="star" disabled="disabled"/> 
<input name="star3" type="radio" class="star" disabled="disabled"/>
+2

, ( ) (3.1), , .

@planetjones, , this.rating('disable'); , this.rating('readOnly'); this.rating('readOnly') , this.rating('disable') .

@svinto, , -, . , , , , 1. 2. 3. - $(). Data ('rating') $(). Data ('rating.star') 4. "change"

, : http://twitter.com/fyneworks

+2

What you really want is to return the elements to the radio buttons, then add read-only, and then make them good again. The return is not possible, but you can cancel all events in the message on the server. $ ("...") untie () ;.

+1
source

More articles:


All Articles