Django Tempus Dominus provides Django widgets for the Tempus Dominus v6 date and time picker.
- From PyPI:
pip install django-tempus-dominus
Then add tempus_dominus to INSTALLED_APPS in your Django settings.
The following settings are available:
TEMPUS_DOMINUS_LOCALIZE(default:False): ifTrue, widgets will be translated to the selected browser language and use the localized date and time formats.TEMPUS_DOMINUS_INCLUDE_ASSETS(default:True): ifTrue, loads Tempus Dominus andmomentJS and CSS from Cloudflare's CDN, otherwise loading the JS and CSS is up to you.TEMPUS_DOMINUS_DATE_FORMAT(default:yyyy-MM-dd)TEMPUS_DOMINUS_DATETIME_FORMAT(default:yyyy-MM-dd HH:mm:ss)TEMPUS_DOMINUS_TIME_FORMAT(default:HH:mm:ss)TEMPUS_DOMINUS_CSS_CLASS(default:form-control): this CSS class will be applied to the form input, defaulting to Bootstrap'sform-control. It can be overridden by passingattrsduring instantiation.TEMPUS_DOMINUS_ICON_PACK(default:fa_five): the icon pack to use. Accepted values:fa_five: FontAwesome 5bi_one: Bootstrap Icons 1
Three widgets are provided:
DatePicker- Defaults to
LifTEMPUS_DOMINUS_LOCALIZEisTrue, otherwiseTEMPUS_DOMINUS_DATE_FORMAT
- Defaults to
DateTimePicker- Defaults to
L LTSifTEMPUS_DOMINUS_LOCALIZEisTrue, otherwiseTEMPUS_DOMINUS_DATETIME_FORMAT
- Defaults to
TimePicker- Defaults to
LTSifTEMPUS_DOMINUS_LOCALIZEisTrue, otherwiseTEMPUS_DOMINUS_TIME_FORMAT
- Defaults to
In your Django form, you can use the widgets like this:
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,
},
),
)Then in your template, include jQuery, {{ form.media }}, and render the form:
<html>
<head>
{# Django Tempus Dominus assets are included in `{{ form.media }}` #}
{{ form.media }}
</head>
<body>
<div class="container">
<div class="row">
<div class="col">
<form method="post" action=".">
{% csrf_token %}
{{ form.as_p }}
</form>
</div>
</div>
</div>
</body>
</html>options(dictionary): This dictionary will be passed to Tempus Dominus. A full list of options is available here.input_toggle(boolean, defaultTrue): Controls whether clicking on the input field toggles the datepicker popup. Typically is set to False when an icon is in use.input_group(boolean, defaultTrue): Whether to include a Bootstrap 4input-grouparound the picker.size(string): Controls the size of the input group (smallorlarge). Defaults to the default size.prepend(string): Name of a Font Awesome icon to prepend to the input field (fa fa-calendar).append(string): Name of a Font Awesome icon to append to the input field (fa fa-calendar).icon_toggle(boolean, defaultTrue): Controls whether clicking on the icon toggles the datepicker popup. Typically is set to False when an icon is in use.
- Timothy Allen (https://github.com/FlipperPA)
- Ian Stewart (https://github.com/ianastewart)
This package is largely maintained by the staff of Wharton Research Data Services. We are thrilled that The Wharton School allows us a certain amount of time to contribute to open-source projects. We add features as they are necessary for our projects, and try to keep up with Issues and Pull Requests as best we can. Due to time constraints (our full time jobs!), Feature Requests without a Pull Request may not be implemented, but we are always open to new ideas and grateful for contributions and our package users.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent