What's the cleanest, simplest-to-get running datepicker in Django?

This is what worked for me . I am using Django 1.11 with bootstrap 3.3 .

Form.py

from django.contrib.admin.widgets import AdminDateWidget

class AddInterview(forms.ModelForm):
    class Meta:
        model = models.Interview
        fields = ['candidate', 'date', 'position', 'question_set']

    date = forms.DateField(widget=AdminDateWidget())

Template:

    <form method="post">
        <div class="form-group">
            {% csrf_token %}
            {{ form.media }}
            {{ form.as_p }}
            <p>Note: Date format is yyyy-mm-dd</p>

        </div>

CSS: (In same above html template file)

<link rel="stylesheet" type="text/css" href="{% static 'admin/css/forms.css' %}"/>
<link rel="stylesheet" type="text/css" href="{% static 'admin/css/widgets.css' %}"/>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" >

JS:(In same above html template file)

<script type="text/javascript" src="/admin/jsi18n/"></script>
<script type="text/javascript" src="{% static 'admin/js/core.js' %}"></script>
<script type="text/javascript" src="{% static 'admin/js/admin/RelatedObjectLookups.js' %}"></script>
<script type="text/javascript" src="{% static 'admin/js/vendor/jquery/jquery.min.js' %}"></script>
<script type="text/javascript" src="{% static 'admin/js/jquery.init.js' %}"></script>
<script type="text/javascript" src="{% static 'admin/js/actions.min.js' %}"></script>
<script type="text/javascript" src="{% static 'admin/js/calendar.js' %}"></script>
<script type="text/javascript" src="{% static 'admin/js/admin/DateTimeShortcuts.js' %}"></script>

Here's an ultra simple way using just html5 and django:

forms.py

class DateInput(forms.DateInput):
    input_type = 'date'

class DateForm(forms.Form):
    start_date = forms.DateField(widget=DateInput)
    end_date = forms.DateField(widget=DateInput)

Views.py

def search_dates(request, pk=''):
    if request.method == "GET": # select dates in calendar
        form = DateForm()
        return render(request, 'search.html', {"form":form})
    if request.method == "POST": # create cart from selected dates
        form = DateForm(request.POST)
        if form.is_valid():
            start = form.cleaned_data['start_date']
            end = form.cleaned_data['end_date']
            start_date = datetime.strftime(start, "%Y-%m-%d")
            end_date = datetime.strftime(end, "%Y-%m-%d")
            print(start_date)
            print(end_date)
    return render(request, 'search.html', {"form":form})

Template

 <form  method="post">
        {% csrf_token %}
        {{ form.as_table }}
        <p style="text-align: center"><input type="submit" value="Search"></p>
 </form>

This is what i do to get datepicker in django forms.

install bootstrap_datepicker_plus by pip command.

pip install django-bootstrap_datepicker_plus

forms.py

from .models import Hello
from django import forms
from bootstrap_datepicker_plus import DatePickerInput

class CreateForm(forms.ModelForm):
    class Meta:
        model = Hello
        fields =[            
            "Date",
        ]

    widgets = {
        'Date': DatePickerInput(),
    }

settings.py

INSTALLED_APPS = [
    'bootstrap_datepicker_plus',
]

Here is my favorite implementation that works directly from CreateView.

from django.views.generic import CreateView
from django.contrib.admin.widgets import AdminDateWidget
from .models import MyModel

class MyModelCreateView(CreateView):
    template_name = 'form.html'
    model = MyModel
    fields = ['date_field', ...]

    def get_form(self, form_class=None):
        form = super(MyModelCreateView, self).get_form(form_class)
        form.fields['date_field'].widget = AdminDateWidget(attrs={'type': 'date'})
        return form

The only thing that could be easier is to have this be the default behavior for Generic CBVs!

Just adding this line of code to my template html, solved my problem:

<div class="mb-3">
<label for="exampleFormControlInput1" class="form-label">Email address</label>
<input type="date" class="form-control" id="exampleFormControlInput1" placeholder="name@example.com">
</div>

[source]