title: Date Picker does not shown up
body: <p>I am new to frontend development. Normally I do backend and infra. During the daytime I heard from the <code>frontend-angular</code> guys talking on <code>datepicker</code> widget a lot. Now I am free from the routine job and have his example source code to study. I would like to start an easiest one first then back to the root source of my curiosity :)</p>
  
  <p><a href="https://stackoverflow.com/questions/16356289/how-to-show-datepicker-calender-on-datefield">how to show datepicker calendar on datefield</a></p>
  
  <p>I am trying to add <code>datepicker</code> to my page replace ordinary textfield with validator:</p>
  
  <pre><code>from django import forms
  
  
  class ReportOneForm(forms.Form):
      start_date = forms.DateField(widget=forms.TextInput(attrs={'class': 'datepicker'}))
      end_date = forms.DateField(widget=forms.TextInput(attrs={'class': 'datepicker'}))
  
      def clean(self):
          cleanded_data = super().clean()
          start_date = cleanded_data.get('start_date')
          end_date = cleanded_data.get('end_date')
  
          if start_date &gt; end_date:
              raise forms.ValidationError(f"Start Date must not after End Date")
  </code></pre>
  
  <p><strong>Template</strong></p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="en"&gt;
  &lt;head&gt;
      &lt;meta charset="UTF-8"&gt;
      &lt;title&gt;Report 1 Result&lt;/title&gt;
      &lt;form method="post" class="post-form"&gt;{% csrf_token %}
          {{ form.as_p }}
          &lt;button type="submit" class="save btn btn-default"&gt;Save&lt;/button&gt;
      &lt;/form&gt;
  &lt;/head&gt;
  &lt;body&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  &lt;script&gt;
    $(function() {
      $( ".datepicker" ).datepicker({
        changeMonth: true,
        changeYear: true,
        yearRange: "1900:2012",
        // You can put more options here.
  
      });
    });
  &lt;/script&gt;
  </code></pre>
  
  <p>I must misunderstand something in this page.</p>