jquery-rate-picker

An easy to use rate picker built on top of jquery and font awesome. Check the online demo

Example 1 [default]:

No callback, data will posted as <input type="hidden" name="rating-1" />

html:

<span id="rating-1" data-stars="3"></span>

javascript:

$.ratePicker("#rating-1");

Example 2 [custom]:

Callback function, colors, maximum starts and pointer given, 
  data will still be posted as <input type="hidden" name="rating-2" />

html:

<span id="rating-2" data-stars="6"></span>

javascript:

$.ratePicker("#rating-2", { max :10, rgbOn:"#e74c3c", rgbOff:"#ecf0f1", rgbSelection:"#e74c3c", cursor:"crosshair", rate : function (stars){ alert('Sample 2 Rate is ' + stars); } });

Example 3 [custom]:

Custom font awesome indicator

html:

<span id="rating-3" data-stars="3"></span>

javascript:

$.ratePicker("#rating-3", { max :5, rgbOn:"#2ecc71", rgbOff:"#bdc3c7", rgbSelection:"#2ecc71", indicator:"fa-thumbs-up" });

Click for live demo

Helton MALAMBANE