Search code examples
jqueryrating

Jquery star rating plugin for decimal rating


I am using a jquery star rating plugin from http://www.fyneworks.com/jquery/star-rating/#tab-Testing. I would like to use decimal star rating for my application. So I am using

Test4 Half Stars and Split Stars

The html code is as below.

<input class="star {split:2}" type="radio" value="0.5" name="test-4-rating-3" />
<input class="star {split:2}" type="radio" value="1.0" name="test-4-rating-3" />
<input class="star {split:2}" type="radio" value="1.5" name="test-4-rating-3" />
<input class="star {split:2}" type="radio" value="2.0" name="test-4-rating-3" />
<input class="star {split:2}" type="radio" value="2.5" name="test-4-rating-3" />
<input class="star {split:2}" type="radio" value="3.0" name="test-4-rating-3" />
<input class="star {split:2}" type="radio" value="3.5" name="test-4-rating-3" />
<input class="star {split:2}" type="radio" value="4.0" name="test-4-rating-3" />
<input class="star {split:2}" type="radio" value="4.5" name="test-4-rating-3" />
<input class="star {split:2}" type="radio" value="5.0" name="test-4-rating-3" />

The script is as below.

$('.star').rating({
       split: 2, 
       callback: function(value, link){
           alert(value);          
       }
   });

Please suggest me how to use {split:2} and how to get the rated value when the stars get clicked. The work will be more appreciale.


Solution

  • So I'm taking a shot in the dark here, because the website you linked isn't very clear, but here's what I got.

    1. According to that website you need to use the special metadata plugin to get the splits to work. Presumably include this file in your HTML before the stars plugin.
    2. As far as I can tell they're just updating the value attribute of the form element, so you can probably access the value like this $(".star").val(), however as you said you want to see the value when you click on the thing, you'll have to follow their instructions.
    3. Are you making sure to wrap your JS in $(function() { }); or putting your JS at the end of the page?
    4. This plugin seems very outdated. I know the website mentions a recent update, but the code quality and links imply it's several years old. I highly recommend using a more modern jquery plugin for your stars, such as any of the several that are on github. Check out Raty which seems to have decent documentation.