https://github.com/monim67/django-bootstrap-datepicker-plus
Bootstrap3/Bootstrap4/Bootstrap5 DatePickerInput, TimePickerInput, DateTimePickerInput, MonthPickerInput, YearPickerInput with date-range-picker functionality for django >= 2.0
https://github.com/monim67/django-bootstrap-datepicker-plus
bootstrap-datepicker date-picker daterangepicker datetimepicker django django-forms django-widget timepicker
Last synced: about 1 year ago
JSON representation
Bootstrap3/Bootstrap4/Bootstrap5 DatePickerInput, TimePickerInput, DateTimePickerInput, MonthPickerInput, YearPickerInput with date-range-picker functionality for django >= 2.0
- Host: GitHub
- URL: https://github.com/monim67/django-bootstrap-datepicker-plus
- Owner: monim67
- License: mit
- Created: 2018-02-27T17:56:21.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2024-02-11T08:47:38.000Z (over 2 years ago)
- Last Synced: 2025-04-03T21:13:23.923Z (about 1 year ago)
- Topics: bootstrap-datepicker, date-picker, daterangepicker, datetimepicker, django, django-forms, django-widget, timepicker
- Language: Python
- Homepage: https://pypi.python.org/pypi/django-bootstrap-datepicker-plus
- Size: 368 KB
- Stars: 224
- Watchers: 9
- Forks: 62
- Open Issues: 33
-
Metadata Files:
- Readme: README.rst
- Contributing: .github/CONTRIBUTING.md
- Funding: .github/FUNDING.yml
- License: LICENSE
- Code of conduct: .github/CODE_OF_CONDUCT.md
Awesome Lists containing this project
README
########################################
django-bootstrap-datepicker-plus
########################################
This django widget contains Bootstrap 3, Bootstrap 4 and Bootstrap 5
Date-Picker, Time-Picker, DateTime-Picker, Month-Picker and Year-Picker input
with date-range-picker functionality for django version >= 2.0.
The widget implements `bootstrap-datetimepicker v4 `_
to show bootstrap-datepicker in django model forms and custom forms
which can be configured easily for date-range selection.
If you are not using Bootstrap use `django-flatpickr `_ instead.
| |build-status| |docs-status| |coverage|
| |pyversions| |djversions| |license|
| |date-picker-image| |datetime-picker-image| |time-picker-image|
********************
Demo
********************
- `With Bootstrap 3 `_
- `With Bootstrap 4 `_
- `With Bootstrap 5 `_
********************
Getting Started
********************
- Follow the `Getting Started doc `_.
- Head over to `Usage <#usage>`_ section to see how to use it in forms and views.
- Read detailed `Documentation on ReadTheDocs `_
- Looks complex to get started? Follow a `Quick Walkthrough Tutorial `_
- Getting errors? See `Troubleshoot instructions `_
********************
Usage
********************
++++++++++++++++++++++++++++++
Usage in Generic View
++++++++++++++++++++++++++++++
.. code:: python
# File: views.py
from bootstrap_datepicker_plus.widgets import DateTimePickerInput
from django.views import generic
from .models import Question
class CreateView(generic.edit.CreateView):
model = Question
fields = ["question_text", "pub_date"]
def get_form(self):
form = super().get_form()
form.fields["pub_date"].widget = DateTimePickerInput()
return form
++++++++++++++++++++++++++++++
Advanced Usage
++++++++++++++++++++++++++++++
- `Usage in Custom Form `_
- `Usage in Model Form `_
- `Usage doc `_
++++++++++++++++++++++++++++++
Types of DatePickers
++++++++++++++++++++++++++++++
The widget contains all types of date-picker you may ever need.
.. code:: python
# File: forms.py
from bootstrap_datepicker_plus.widgets import DatePickerInput, TimePickerInput, DateTimePickerInput, MonthPickerInput, YearPickerInput
from django import forms
class EventForm(forms.ModelForm):
class Meta:
model = Event
fields = ["start_date", "start_time", "start_datetime", "start_month", "start_year"]
widgets = {
"start_date": DatePickerInput(),
"start_time": TimePickerInput(),
"start_datetime": DateTimePickerInput(),
"start_month": MonthPickerInput(),
"start_year": YearPickerInput(),
}
++++++++++++++++++++++++++++++
Implement date-range-picker
++++++++++++++++++++++++++++++
DatePickers can be linked to select a date-range or time-range.
.. code:: python
# File: forms.py
from bootstrap_datepicker_plus.widgets import DatePickerInput, TimePickerInput
from django import forms
class EventForm(forms.ModelForm):
class Meta:
model = Event
fields = ["name", "start_date", "end_date", "start_time", "end_time"]
widgets = {
"start_date": DatePickerInput(),
"end_date": DatePickerInput(range_from="start_date"),
"start_time": TimePickerInput(),
"end_time": TimePickerInput(range_from="start_time"),
}
++++++++++++++++++++++++++++++
Customization
++++++++++++++++++++++++++++++
- `Customize date format, language `_
- `Use custom template for widget input `_
********************
Contributing
********************
- `CONTRIBUTING.md `_.
- `CODE_OF_CONDUCT.md `_.
********************
License
********************
This project is licensed under `MIT LICENSE `_ file for details.
********************
Acknowledgments
********************
This project implements `Eonasdan/bootstrap-datetimepicker `_ to display date-pickers.
The project was initially forked from `pbucher/django-bootstrap-datepicker `_ and
later reworked completely under MIT Licence.
|buymeacoffee|
.. |date-picker-image| image:: https://raw.githubusercontent.com/monim67/django-bootstrap-datepicker-plus/26d89a744d403a895422313a48c02885c4718251/images/date-picker.png
:alt: Date-picker
:width: 218px
:height: 280px
.. |datetime-picker-image| image:: https://raw.githubusercontent.com/monim67/django-bootstrap-datepicker-plus/26d89a744d403a895422313a48c02885c4718251/images/datetime-picker.png
:alt: Datetime-picker
:width: 218px
:height: 280px
.. |time-picker-image| image:: https://raw.githubusercontent.com/monim67/django-bootstrap-datepicker-plus/26d89a744d403a895422313a48c02885c4718251/images/time-picker.png
:alt: Time-picker
:width: 218px
:height: 280px
.. |build-status| image:: https://github.com/monim67/django-bootstrap-datepicker-plus/actions/workflows/build.yml/badge.svg?event=push
:target: https://github.com/monim67/django-bootstrap-datepicker-plus/actions/workflows/build.yml
:alt: Build Status
:height: 20px
.. |docs-status| image:: https://readthedocs.org/projects/django-bootstrap-datepicker-plus/badge/?version=latest
:target: https://django-bootstrap-datepicker-plus.readthedocs.io/en/latest/?badge=latest
:alt: Documentation Status
:height: 20px
.. |coverage| image:: https://coveralls.io/repos/github/monim67/django-bootstrap-datepicker-plus/badge.svg?branch=master
:target: https://coveralls.io/github/monim67/django-bootstrap-datepicker-plus?branch=master
:alt: Coverage Status
:height: 20px
.. |pyversions| image:: https://img.shields.io/pypi/pyversions/django-bootstrap-datepicker-plus.svg
:target: https://pypi.python.org/pypi/django-bootstrap-datepicker-plus
:alt: Python Versions
:height: 20px
.. |djversions| image:: https://img.shields.io/pypi/djversions/django-bootstrap-datepicker-plus.svg
:target: https://pypi.python.org/pypi/django-bootstrap-datepicker-plus
:alt: DJango Versions
:height: 20px
.. |license| image:: https://img.shields.io/pypi/l/django-bootstrap-datepicker-plus.svg
:target: https://pypi.python.org/pypi/django-bootstrap-datepicker-plus
:alt: Licence
:height: 20px
.. |buymeacoffee| image:: https://cdn.buymeacoffee.com/buttons/v2/default-orange.png
:target: https://www.buymeacoffee.com/monim67
:alt: Buy Me A Coffee
:height: 48px