### Install django-tempus-dominus package via pip
Source: https://github.com/flipperpa/django-tempus-dominus/blob/main/README.md
Installs the django-tempus-dominus package from PyPI using pip. This command adds the Django widget library for Tempus Dominus date/time picker to your Python environment. Requires pip and an active virtual environment for best practices.
```shell
pip install django-tempus-dominus
```
--------------------------------
### Integrate Tempus Dominus widgets in Django templates
Source: https://context7.com/flipperpa/django-tempus-dominus/llms.txt
Template example showing how to include Tempus Dominus form media and render datetime picker widgets. Requires Bootstrap for styling and includes error handling for form fields.
```html
Event Registration
{{ form.media }}
Event Registration
```
--------------------------------
### TimePicker Widget Configuration in Django Forms
Source: https://context7.com/flipperpa/django-tempus-dominus/llms.txt
Shows how to implement the TimePicker widget for time-only selection in Django forms. Examples cover basic setup, setting a default time, restricting available hours, and adding an 'append' icon for visual cues.
```python
from django import forms
from tempus_dominus.widgets import TimePicker
class ScheduleForm(forms.Form):
# Basic time picker
start_time = forms.TimeField(widget=TimePicker())
# Time picker with default time and hour restrictions
office_hours = forms.TimeField(
widget=TimePicker(
options={
'defaultDate': '1970-01-01T09:00:00',
'restrictions': {
'enabledHours': [9, 10, 11, 12, 13, 14, 15, 16, 17]
}
},
),
)
# Time picker with appended icon
appointment_time = forms.TimeField(
widget=TimePicker(
attrs={
'append': 'fa fa-clock',
'size': 'small'
}
)
)
# Note: For defaultDate in TimePicker, only the time portion matters.
# The date portion (1970-01-01) is required for valid MomentJS format
# but is ignored by the time picker.
```
--------------------------------
### DatePicker Widget Configuration in Django Forms
Source: https://context7.com/flipperpa/django-tempus-dominus/llms.txt
Demonstrates how to use the DatePicker widget in Django forms for date-only selection. Includes examples for basic usage, setting restrictions (min/max dates), default values, and custom icons using 'prepend' attribute.
```python
from django import forms
from tempus_dominus.widgets import DatePicker
class EventForm(forms.Form):
# Basic date picker
event_date = forms.DateField(widget=DatePicker())
# Date picker with restrictions and initial value
conference_date = forms.DateField(
required=True,
widget=DatePicker(
options={
'restrictions': {
'minDate': '2024-01-01',
'maxDate': '2024-12-31',
}
},
),
initial='2024-06-15',
)
# Date picker with custom icon
meeting_date = forms.DateField(
widget=DatePicker(
attrs={
'prepend': 'fa fa-calendar',
'size': 'large'
}
)
)
# Usage in template:
#
```
--------------------------------
### Customize Tempus Dominus widgets in Django forms
Source: https://context7.com/flipperpa/django-tempus-dominus/llms.txt
Examples of customizing DatePicker and DateTimePicker widgets with options for date restrictions, display components, and HTML attributes. Options are passed directly to the Tempus Dominus JavaScript library.
```python
from django import forms
from tempus_dominus.widgets import DatePicker, DateTimePicker
class CustomizedForm(forms.Form):
# Comprehensive options example
event_date = forms.DateField(
widget=DatePicker(
options={
'restrictions': {
'minDate': '2024-01-01',
'maxDate': '2024-12-31',
'daysOfWeekDisabled': [0, 6], # Disable weekends
},
'display': {
'components': {
'decades': True,
'year': True,
'month': True,
'date': True,
},
'inline': False,
'buttons': {
'today': True,
'clear': True,
'close': True,
},
},
},
attrs={
'prepend': 'fas fa-calendar', # Prepend icon
'append': '', # Append icon (alternative to prepend)
'input_toggle': True, # Click input to toggle (default)
'icon_toggle': True, # Click icon to toggle (default)
'input_group': True, # Use Bootstrap input-group (default)
'size': 'large', # 'small', 'large', or omit for default
'class': 'custom-datepicker', # Additional CSS classes
}
)
)
# Disable all toggles for read-only display
display_only = forms.DateTimeField(
widget=DateTimePicker(
attrs={
'icon_toggle': False,
'input_toggle': False,
}
),
disabled=True,
)
```
--------------------------------
### DateTimePicker Widget Configuration in Django Forms
Source: https://context7.com/flipperpa/django-tempus-dominus/llms.txt
Illustrates the usage of the DateTimePicker widget in Django forms for selecting both date and time. Examples show basic instantiation, setting 'useCurrent' to default to the current date/time, and configuring restrictions and custom localization formats.
```python
from django import forms
from tempus_dominus.widgets import DateTimePicker
class AppointmentForm(forms.Form):
# Basic datetime picker
appointment_datetime = forms.DateTimeField(widget=DateTimePicker())
# Datetime picker that defaults to current date/time
created_at = forms.DateTimeField(
widget=DateTimePicker(
options={
'useCurrent': True,
},
),
)
# Datetime picker with restrictions and custom format
event_datetime = forms.DateTimeField(
widget=DateTimePicker(
options={
'restrictions': {
'minDate': '2024-01-01T00:00:00',
'maxDate': '2024-12-31T23:59:59',
},
'localization': {
'format': 'yyyy-MM-dd HH:mm'
}
},
attrs={
'prepend': 'fa fa-calendar-alt',
}
),
)
# The picker displays a calendar for date selection and
# clock interface for time selection in the same widget.
```
--------------------------------
### Implement Complete Form with Multiple Picker Widgets and Validation
Source: https://context7.com/flipperpa/django-tempus-dominus/llms.txt
Shows a comprehensive MeetingScheduleForm using DatePicker, TimePicker, and DateTimePicker widgets with restrictions. Includes custom validation to ensure end time is after start time. The view handles form processing with success messaging and redirects. Demonstrates widget options like enabledHours, minDate, and useCurrent.
```python
# forms.py
from django import forms
from django.core.exceptions import ValidationError
from tempus_dominus.widgets import DatePicker, TimePicker, DateTimePicker
from datetime import date, datetime
class MeetingScheduleForm(forms.Form):
meeting_date = forms.DateField(
label="Meeting Date",
widget=DatePicker(
options={
'restrictions': {
'minDate': date.today().isoformat(),
},
},
attrs={
'prepend': 'fa fa-calendar',
}
),
help_text="Select a date in the future"
)
start_time = forms.TimeField(
label="Start Time",
widget=TimePicker(
options={
'restrictions': {
'enabledHours': list(range(8, 18)), # 8 AM to 5 PM
}
},
attrs={
'prepend': 'fa fa-clock',
}
)
)
end_time = forms.TimeField(
label="End Time",
widget=TimePicker(
options={
'restrictions': {
'enabledHours': list(range(8, 18)),
}
}
)
)
created_at = forms.DateTimeField(
label="Created At
```
--------------------------------
### Configure Icon Packs for DatePicker Widgets in Django Forms
Source: https://context7.com/flipperpa/django-tempus-dominus/llms.txt
Demonstrates setting a global icon pack via Django settings and overriding icons for individual DatePicker widgets. Shows how to customize display icons and prepend attributes using Bootstrap Icons syntax. Requires including external CSS for the chosen icon library in templates.
```python
# settings.py - Set global icon pack
TEMPUS_DOMINUS_ICON_PACK = 'bi_one' # Use Bootstrap Icons
# forms.py - Custom icon configuration per widget
from django import forms
from tempus_dominus.widgets import DatePicker
class IconCustomizationForm(forms.Form):
# Use default icon pack from settings
standard_date = forms.DateField(widget=DatePicker())
# Override icons for specific widget
custom_icons_date = forms.DateField(
widget=DatePicker(
options={
'display': {
'icons': {
'type': 'icons',
'time': 'bi bi-clock-fill',
'date': 'bi bi-calendar-event',
'up': 'bi bi-arrow-up-circle',
'down': 'bi bi-arrow-down-circle',
'previous': 'bi bi-chevron-left',
'next': 'bi bi-chevron-right',
'today': 'bi bi-calendar-check',
'clear': 'bi bi-trash',
'close': 'bi bi-x-circle',
}
}
},
attrs={
'prepend': 'bi bi-calendar3',
}
)
)
# Template must include appropriate icon library CSS:
# For FontAwesome 5:
# For Bootstrap Icons:
# For Tabler Icons:
```
--------------------------------
### Render tempus_dominus forms in Django templates
Source: https://github.com/flipperpa/django-tempus-dominus/blob/main/README.md
Shows the complete HTML template structure for rendering forms with tempus_dominus widgets. Includes the essential {{ form.media }} tag that loads required CSS and JavaScript assets from CDN or local sources. Demonstrates standard form rendering with CSRF protection and Bootstrap container structure.
```HTML+Django
{# Django Tempus Dominus assets are included in `{{ form.media }}` #}
{{ form.media }}
```
--------------------------------
### Configure Tempus Dominus in Django settings.py
Source: https://context7.com/flipperpa/django-tempus-dominus/llms.txt
Global configuration options for Tempus Dominus widgets in Django. Controls localization, asset loading, date formats, styling, and icon packs. Must be added to INSTALLED_APPS.
```python
# settings.py
# Enable localization to use browser language and locale-specific formats
TEMPUS_DOMINUS_LOCALIZE = True # Default: False
# Control automatic loading of Tempus Dominus assets from CDN
TEMPUS_DOMINUS_INCLUDE_ASSETS = True # Default: True
# Customize date/time format strings (ignored if LOCALIZE is True)
TEMPUS_DOMINUS_DATE_FORMAT = 'yyyy-MM-dd' # Default
TEMPUS_DOMINUS_DATETIME_FORMAT = 'yyyy-MM-dd HH:mm:ss' # Default
TEMPUS_DOMINUS_TIME_FORMAT = 'HH:mm:ss' # Default
# Set default CSS class for form inputs (Bootstrap styling)
TEMPUS_DOMINUS_CSS_CLASS = 'form-control' # Default
# Choose icon pack: 'fa_five', 'bi_one', or 'ti_two'
TEMPUS_DOMINUS_ICON_PACK = 'fa_five' # Default: FontAwesome 5
# Optional: Specify Tempus Dominus version
TEMPUS_DOMINUS_VERSION = '6.7.16' # Default
# Add to INSTALLED_APPS
INSTALLED_APPS = [
# ... other apps
'tempus_dominus',
]
```
--------------------------------
### Configure Django settings for tempus_dominus
Source: https://github.com/flipperpa/django-tempus-dominus/blob/main/README.md
Configures Django settings to enable django-tempus-dominus functionality. Adds 'tempus_dominus' to INSTALLED_APPS and sets default formats, localization, asset loading behavior, CSS classes, and icon packs. These settings control the appearance and behavior of all date/time picker widgets project-wide.
```python
# Add to INSTALLED_APPS in settings.py
INSTALLED_APPS = [
...
'tempus_dominus',
]
# Available settings with defaults
TEMPUS_DOMINUS_LOCALIZE = False # Set True for browser language translation
TEMPUS_DOMINUS_INCLUDE_ASSETS = True # Load JS/CSS from CDN if True
TEMPUS_DOMINUS_DATE_FORMAT = 'yyyy-MM-dd'
TEMPUS_DOMINUS_DATETIME_FORMAT = 'yyyy-MM-dd HH:mm:ss'
TEMPUS_DOMINUS_TIME_FORMAT = 'HH:mm:ss'
TEMPUS_DOMINUS_CSS_CLASS = 'form-control'
TEMPUS_DOMINUS_ICON_PACK = 'fa_five' # Options: 'fa_five', 'bi_one'
```
--------------------------------
### Use DateTimePicker widgets in Django forms
Source: https://github.com/flipperpa/django-tempus-dominus/blob/main/README.md
Demonstrates implementation of DatePicker, TimePicker, and DateTimePicker widgets in a Django form class. Shows how to configure options like min/max date restrictions, enabled hours, default values, and localized formats. The options dictionary is passed directly to the Tempus Dominus JavaScript library, supporting all native options.
```python
from django import forms
from tempus_dominus.widgets import DatePicker, TimePicker, DateTimePicker
class MyForm(forms.Form):
date_field = forms.DateField(widget=DatePicker())
date_field_required_with_min_max_date = forms.DateField(
required=True,
widget=DatePicker(
options={
'restrictions': {
'minDate': '2009-01-20',
'maxDate': '2017-01-20',
}
},
),
initial='2013-01-01',
)
"""
In this example, the date portion of `defaultDate` is irrelevant;
only the time portion is used. The reason for this is that it has
to be passed in a valid MomentJS format. This will default the time
to be 14:56:00 (or 2:56pm).
"""
time_field = forms.TimeField(
widget=TimePicker(
options={
'defaultDate': '1970-01-01T14:56:00',
'restrictions': {
'enabledHours': [9, 10, 11, 12, 13, 14, 15, 16]
}
},
),
)
datetime_field = forms.DateTimeField(
widget=DateTimePicker(
options={
'useCurrent': True,
},
),
)
```
=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.