PrimeFaces Cookbook - Second Edition

Slider – different ways to provide input

The slider component provides the user with the ability to input a value by using a slider bar. This component requires an input component to work properly.

How to do it…

As mentioned earlier, we first need to define an input component that will be used by the slider component. The for attribute is used to set the ID of the input component whose input will be provided by the slider component. The basic definition of a slider would be as follows:

<h:inputText id="basicSlider" value="#{sliderBean.intValue}" />
<p:slider for="basicSlider" />

This will render an input text along with a horizontal slider bar as follows:

By default, the slider renders a horizontal bar for sliding. With the type attribute, the slider ...