rating:change

This event is triggered when the star rating is modified or changed (this is in addition to the default change event). This event also allows you to access these parameters:

• value: the selected rating value
  

• caption: the caption for the selected rating

Example:

$('#input-id').on('rating:change', function(event, value, caption) {
    console.log(value);
    console.log(caption);
});

rating:clear

This event is triggered when the rating is cleared with the clear button.

Example:

$('#input-id').on('rating:clear', function(event) {
    console.log("rating:clear");
});

rating:reset

This event is triggered when the rating is reset to initial value.

Example:

$('#input-id').on('rating:reset', function(event) {
    console.log("rating:reset");
});

rating:hover

This event is triggered, when the mouse (pointing input device) is hovered inside a star rating or the clear button. This event also allows you to access these parameters:

• value: the selected rating value

• caption: the caption for the selected rating

• target: the target for the hover - returns whether you hovered on the stars or the clear button.

Example:

$('#input-id').on('rating:hover', function(event, value, caption, target) {
    console.log(value);
    console.log(caption);
    console.log(target);
});

rating:hoverleave

This event is triggered, when the mouse (pointing input device) is hovered out of a star rating or the clear button without clicking. This event also allows you to access these parameters:

• target: the target for the hover - returns whether you left hovering on the stars or the clear button.

$('#input-id').on('rating:hoverleave', function(event, target) {
    console.log(target);
});

rating:mouseenter

This event is triggered, when the mouse (pointing input device) enters a specific star within the rating This event also allows you to access these parameters:

• index: int, the index of the star (starting from 1) where the mouse is hovered.

• status: string, the type of star hovered - can be one of filled-star or empty-star

• $star: jQuery object, the jQuery object for the current star hovered. You can use this to retrieve HTML attributes of the star (e.g. $star.attr('title')).

Example:

$('#input-id').on('rating:mouseenter', function(event, index, status, $star) {
    console.log(index);
    console.log(status);
    console.log($star);
    console.log($star.attr('title'));
});

rating:mouseleave

This event is triggered, when the mouse (pointing input device) leaves/ exits a specific star within the rating This event also allows you to access these parameters:

• index: int, the index of the star (starting from 1) where the mouse was hovered.

• status: string, the type of star hovered - can be one of filled-star or empty-star

• $star: jQuery object, the jQuery object for the current star hovered. You can use this to retrieve HTML attributes of the star (e.g. $star.attr('title')).

Example:

$('#input-id').on('rating:mouseleave', function(event, index, status, $star) {
    console.log(index);
    console.log(status);
    console.log($star);
    console.log($star.attr('title'));
});

rating:focus

This event is triggered, when the rating has been focused via the keyboard or on click.

Example:

$('#input-id').on('rating:focus', function(event) {
    // do something
});

rating:blur

This event is triggered, when one has blurred/ navigated out of the rating (typically via the keyboard) - thus removing its focus.

Example:

$('#input-id').on('rating:blur', function(event) {
    // do something
});

rating:keydown

This event is triggered, when one increments or decrements the rating using the keyboard RIGHT and LEFT arrow keys. This event also allows you to access these parameters:

• value: the selected rating value

• caption: the caption for the selected rating

Example:

$('#input-id').on('rating:blur', function(event, value, caption) {
    console.log(value);
    console.log(caption);
});