Blazor TimePicker Example - Time Duration

TimePicker / Time Duration

The following example demonstrates the popup list element in specific time duration. Click/Touch the TimePicker popup icon to select the desired value.

Loading Syncfusion Blazor Server Demos…

The Time Duration example illustrates, how to customize or disable the time values in the time list popup by using the OnItemRender event. Here, all the time values have additional information on duration between them in sequence and some of the values are disabled through OnItemRender event by adding the e-disabled class. By using the ScrollTo property, you can set the scroll position to the given value when no value is selected or the selected value is not available in the timepicker popup list.

Transform your Blazor web apps today with Syncfusion® Blazor components
100+ high-performance and responsive UI components
Dedicated support
Hassle-free licensing
TRY IT FOR FREE