Star Rating with JSF

Star based ratings are common in content driven web applications and PrimeFaces provides an out of the box solution for this. Rating component allows users to submit a rating using stars and also with Ajax RateEvent it’s possible to mark something just like in gmail where you mark an email with a star.

Basic Usage

public class Bean {

	private Double rating;

	public Double getRating() {
		return rating;
	}
	public void setRating(Double rating) {
		this.rating = rating;
	}
}
<p:rating value="#{bean.rating}" />

The output would be;

rate1

Number of Stars

By default 5 stars are displayed, this can be configured with the stars option.

<p:rating value="#{bean.rating}" stars="10"/>

rate2

Ajax RateEvent and RateListener

RateListeners are handy in case you want to listen for instant rateEvents.

<p:rating rateListener="#{bean.handleRate}" />
public class Bean {

	public void handleRate(RateEvent rateEvent) {
		Double rate = rateEvent.getRating();

		//use rate
	}
}

Online Demo

Check out the rating component in PrimeFaces Component ShowCase live demo.

Comments are closed.

%d bloggers like this: