• Material 3
  • Material 3 Dark
  • Fluent
  • Fluent Dark
  • Bootstrap v5
  • Bootstrap v5 Dark
  • Tailwind CSS
  • Tailwind CSS Dark
  • Material
  • Bootstrap v4
  • High Contrast
Theme Selection
Mode Selection
*Translated by Google Translator.

Example of Time Duration in ASP.NET MVC TimePicker Control

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


The Formatting sample illustrates, how to format, disable or append the any HTML Element to the specific list item in a TimePicker component by using itemRender event. Also, the time interval value is displayed in list items and the time value "12:00 AM" , "3:00 AM", "6:00 AM", "9:00 AM", "12:00 PM", "3:00 PM", "6:00 PM" and "9:00 PM" is disabled by adding the e-disabled class.

More information about the TimePicker and it's configuration can be found in the documentation section.