jRating : Very flexible jQuery plugin for creating quickly a star rating system

jRating is a very flexible jQuery plugin for quickly creating an Ajaxed star rating system. It is possible to configure every details from "the number of the stars" to "if the stars can represent decimals or not".

There is also an option to display small or big stars and images can be changed with any other file easily.

Although jRating can be used with any scripting language, a PHP file that handles the requests is already included in the download package on github.

DOWNLOADDEMONSTRATIONPLUGIN HOMEPAGE

• IMPLEMENTATION
• OPTIONS
• METHODS
• SCREENSHOTS

IMPLEMENTATION: 

1. FIRST, INCLUDE THE CSS & JQUERY FILES

1 2 3 4 5 6

<!-- include CSS & JS files --> <!-- CSS file --> <link rel="stylesheet" type="text/css" href="jRating.jquery.css" media="screen" /> <!-- jQuery files --> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" src="jRating.jquery.js"></script>

2. ADD YOUR HTML

1 2 3 4 5 6 7

<!-- basic exemple --> <div class="exemple">    <!-- in this exemple, 12 is the average and 1 is the id of the line to update in DB -->    <div class="basic" id="12_1"></div>     <!-- in this other exemple, 8 is the average and 2 is the id of the line to update in DB -->    <div class="basic" id="8_2"></div> </div>

3. NOW, CALL THE JRATING PLUGIN

1 2 3 4 5 6 7 8 9 10 11 12 13 14

<script type="text/javascript"> $(document).ready(function(){       // simple jRating call       $(".basic").jRating();       // more complex jRating call       $(".basic").jRating({          step:true,          length : 20, // nb of stars          onSuccess : function(){          alert('Success : your rate has been saved :)');       }    }); }); </script>

OPTIONS: 

showRateInfo

Boolean

Default : true - Disable the rate info. Can be set to true or false

bigStarsPath

String

Default : 'jquery/icons/stars.png' - Relative path of the large star picture (stars.png).

smallStarsPath

String

Default : 'jquery/icons/small.png' - Relative path of the small star picture (small.png).

phpPath

String

Default : 'php/jRating.php' - Relative path of the PHP page (jRating.php).

type

String

Default : 'big' - Appearance type. Can be set to 'small' or 'big'.

step

Boolean

Default : false - If set to true, filling of the stars is done star by star (step by step).

isDisabled

Boolean

Default : false - If set to true, jRating is disabled

length

Integer

Default : 5 - Number of star to display.

decimalLength

Integer

Default : 0 - Number of decimals in the rate

rateMax

Integer

Default : 20 - Maximal rate

rateInfosX

Integer

Default : 45 - In pixel - Absolute left position of the information box during mousemove.

rateInfosY

Integer

Default : 5 - In pixel - Absolute top position of the information box during mousemove.

METHODS: 

onSuccess

Function

Returns : null - Callback function in case of success during rating.

onError

Function

Returns : null - Callback function in case of failure during rating.

SCREENSHOTS

•