rater
A highly customizable rating widget that supports images, utf8 glyphs and other html elements!
Simple usage
Depends on jQuery
// Options
var options = {
max_value: 10,
step_size: 0.5,
initial_value: 0,
selected_symbol_type: 'utf8_star', // Must be a key from symbols
cursor: 'default',
readonly: false,
change_once: false, // Determines if the rating can only be set once
ajax_method: 'POST',
url: 'http://localhost/test.php',
additional_data: {} // Additional data to send to the server
}
$(".rating").rate(options);
The data-rate-value attribute is optional. The value will fallback to the initial value in the settings and to 0 if not provided.
<div class="rating" data-rate-value=6></div>
Useful methods
$(".rating").rate("getValue");
$(".rating").rate("setValue");
$(".rating").rate("increment");
$(".rating").rate("decrement");
$(".rating").rate("getElement", layer_name, element_index);
$(".rating").rate("getLayers");
$(".rating").rate("setFace", value, face);
$(".rating").rate("removeFace", value);
// Set additional information to be sent with the ajax request
$(".rate2").rate("setAdditionalData", {id: 42});
$(".rate2").rate("getAdditionalData");
Useful events
$(".rating").on("change", function(ev, data){
console.log(data.from, data.to);
});
$(".rate2").on("updateSuccess", function(ev, data){
console.log("This is a custom success event");
});
$(".rate2").on("updateError", function(ev, jxhr, msg, err){
console.log("This is a custom error event");
});
Deleting
$(".rating").rate("destroy");
$(".rating").remove(); //This will remove the elements from the DOM