[Django APP] django-bootstrap-datepicker-plus
[설치]
pip install django-bootstrap-datepicker-plus
[설정]
INSTALLED_APPS = [
# Add the following
'bootstrap_datepicker_plus',
]
[활용]
# Use BOOTSTRAP3 if you are using Bootstrap 3
BOOTSTRAP4 = {
'include_jquery': True,
}
{% load bootstrap4 %} {# import bootstrap4/bootstrap3 #}
{% bootstrap_css %} {# Embed Bootstrap CSS #}
{% bootstrap_javascript jquery='full' %} {# Embed Bootstrap JS+jQuery #}
{{ form.media }} {# Adds date-picker required JS and CSS #}
# File: views.py
from django.shortcuts import render
from .forms import UserForm
def create_user(request):
user_form = UserForm()
return render(request, 'my_template.html', {'my_form': user_form})
[사례]
Custom Form usage
# File: forms.py
from bootstrap_datepicker_plus import DatePickerInput
from django import forms
class ToDoForm(forms.Form):
todo = forms.CharField(
widget=forms.TextInput(attrs={"class": "form-control"})
)
date = forms.DateField(
widget=DatePickerInput(format='%m/%d/%Y')
)
Model Form usage
# File: forms.py
from bootstrap_datepicker_plus import DatePickerInput
from django import forms
class EventForm(forms.ModelForm):
class Meta:
model = Event
fields = ['name', 'start_date', 'end_date']
widgets = {
'start_date': DatePickerInput(), # default date-format %m/%d/%Y will be used
'end_date': DatePickerInput(format='%Y-%m-%d'), # specify date-frmat
}
Types of DatePickers
The widget contains all types of date-picker you may ever need.
# File: forms.py
from bootstrap_datepicker_plus 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.
# File: forms.py
from bootstrap_datepicker_plus 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().start_of('event days'),
'end_date':DatePickerInput().end_of('event days'),
'start_time':TimePickerInput().start_of('party time'),
'end_time':TimePickerInput().end_of('party time'),
}
Customize the Options
The DatePicker can be customised by passing options to it. The options will be passed to the JavaScript datepicker instance, and are documented and demonstrated in Bootstrap Datepicker Options Reference.
# File: forms.py
from bootstrap_datepicker_plus import DatePickerInput
from django import forms
class EventForm(forms.ModelForm):
class Meta:
model = Event
fields = ['name', 'start_date', 'end_date']
widgets = {
'start_date': DatePickerInput(format='%m/%d%Y'), # python date-time format
'end_date': DatePickerInput(
options={
"format": "MM/DD/YYYY", # moment date-time format
"showClose": True,
"showClear": True,
"showTodayButton": True,
}
),
}
댓글
댓글 쓰기