Time Picker

Last Updated: July 2026

class tethys_sdk.gizmos.TimePicker(name, display_text='', default_time='', minute_step=15, second_step=30, show_seconds=False, show_meridian=True, show_inputs=True, disable_focus=False, snap_to_step=False, max_hours=24, explicit_mode=False, initial='', disabled=False, error='', success='', attributes=None, classes='')

Time pickers are used to make the input of times streamlined and easy. Rather than typing the time, the user is presented with a spinner-style widget to select the time. This time picker was implemented using Bootstrap Timepicker.

name

Name of the input element that will be used for form submission.

Type:

str, required

display_text

Display text for the label that accompanies time picker.

Type:

str

default_time

The time to display when the picker is first opened with no value (e.g.: '2:30 PM'). Use 'current' to default to the current time.

Type:

str

minute_step

Specify a step for the minute field.

Type:

int

second_step

Specify a step for the second field (only applies when show_seconds is True).

Type:

int

show_seconds

Set whether to show the seconds field.

Type:

bool

show_meridian

Set whether to use a 12-hour clock with an AM/PM selector (True) or a 24-hour clock (False).

Type:

bool

show_inputs

Set whether the widget shows editable text inputs for each field.

Type:

bool

disable_focus

Set whether to disable the widget from opening on input focus.

Type:

bool

snap_to_step

Set whether to snap selected values to the nearest step when scrolling.

Type:

bool

max_hours

Specify a maximum number of hours the widget will spin up to (only applies with a 24-hour clock).

Type:

int

explicit_mode

When True, the user may enter a time without a colon (e.g.: '0900' becomes '09:00').

Type:

bool

initial

Initial time to appear in time picker.

Type:

str

disabled

Disabled state of the time picker.

Type:

bool

error

Error message for form validation.

Type:

str

success

Success message for form validation.

Type:

str

attributes

A dictionary representing additional HTML attributes to add to the primary element (e.g. {"onclick": "run_me();"}).

Type:

dict

classes

Additional classes to add to the primary HTML element (e.g. "example-class another-class").

Type:

str

Controller Example

from tethys_sdk.gizmos import TimePicker

# Time Picker Options
time_picker = TimePicker(name='time1',
                         display_text='Time',
                         minute_step=15,
                         show_meridian=True,
                         default_time='2:30 PM',
                         initial='2:30 PM')

time_picker_error = TimePicker(name='time2',
                               display_text='Time',
                               initial='10:00 AM',
                               disabled=True,
                               error='Here is my error text.')

context = {
            'time_picker': time_picker,
            'time_picker_error': time_picker_error,
          }

Template Example

{% load tethys_gizmos %}

{% gizmo time_picker %}
{% gizmo time_picker_error %}