HOME

Example of Formatting in ASP.NET Core Range Slider Control

This sample demonstrates the formatting of ticks and tooltip of Slider. Drag the thumb over the bar for selecting the formatted values between min and max.

DEMO

SOURCE

Currency Slider

Kilometer Slider

Time Slider

The format feature customizes the units of Slider values to the desired format. The formatted values will also be applied to the ARIA attributes of the slider.

In this demo, Slider with currency, kilometer, and time formatting is demonstrated.

Currency Slider – In this sample, ticks and tooltip are formatted to currency using format API in both tooltip and ticks.
Kilometer Slider – In this sample, ticks and tooltip are formatted to kilometer using format API in both tooltip and ticks.
Time Slider – In this sample, ticks and tooltip are formatted to time using change event in tooltip and renderingTicks event in ticks

For more information, refer to the format section from the documentation.