title: Django form not displaying Datepicker and Timepicker
body: <p>Hi Djangonauts,
                     I am new to Django. Please forgive any mistakes in code or logic. I am using <em>django-bootstrap-datepicker-plus</em> from the below repository to add a datepicker to my code.  <a href="https://github.com/monim67/django-bootstrap-datepicker-plus" rel="nofollow noreferrer">https://github.com/monim67/django-bootstrap-datepicker-plus</a>. I have done a pip install. I have done <code>pip install django-bootstrap-datepicker-plus</code>. I have added this in my settings</p>
  
  <pre><code>INSTALLED_APPS = [    
      'bootstrap_datepicker_plus',
  ]
  </code></pre>
  
  <p>also added</p>
  
  <pre><code>BOOTSTRAP3 = {
      'include_jquery': True,
  }
  </code></pre>
  
  <p>However it is not working. I have all my code below. I am also not able to add DecimalField and IntegerField in my form as that gives errors. But right now I am more focused on the Datepicker. I have attached images of how it should display and how it is displaying. What am I doing wrong here  </p>
  
  <p><strong>Forms.py</strong></p>
  
  <pre><code>from django import forms
  from .models import Event
  from bootstrap_datepicker_plus import DatePickerInput, TimePickerInput
  
  
  class EventForm(forms.ModelForm):
      price: forms.DecimalField(decimal_places=2, max_digits=5)
      quantity: forms.IntegerField()
  class Meta:
      model = Event
      fields = ('price', 'stock', 'date', 'time_from', 'time_to', 'event_choice')
      widgets = {
          'date': DatePickerInput(),
          'time_from': TimePickerInput(),
          'time_to': TimePickerInput(),
  
      }
  
  def __init__(self, *args, **kwargs):
      super().__init__(*args, **kwargs)
      self.fields['stock'].label = "How many people can attend your event"
      self.fields['price'].label = "How much do members have to pay to attend"
      self.fields['event_choice'].label = "What kind of event is this?"
      self.fields['date'].label = "When do you plan to host your event"
      self.fields['time_from'].label = "What time does the event start"
      self.fields['time_to'].label = "What time does the event end"
  </code></pre>
  
  <p><strong>Template.html</strong></p>
  
  <pre><code>  {% extends 'base.html' %}
    {% block body %}
    {% load bootstrap3 %}
    {% block extrahead %}       {# Extra Resources Start #}
    {{ form.media }}            {# Form required JS and CSS #}
    {% endblock %}              {# Extra Resources End #}
  
  
  
  
  
  &lt;div class="form-group row"&gt;
       {{field.errors}}
       &lt;form action="{% url 'event:new_event' slug=post.slug %}" method="post" &gt;
           {% csrf_token %}
           {% bootstrap_form form %} 
           &lt;input type="submit" value="Save" class="btn btn-success btn-sm" /&gt;
       &lt;/form&gt;
  &lt;/div&gt;
  {% endblock  %}
  </code></pre>
  
  <p><strong>Models.py</strong></p>
  
  <pre><code>class Event(models.Model):
      user = models.ForeignKey(User, related_name='seller')
      post = models.ForeignKey(Post, related_name='course')
      price = models.DecimalField(max_digits=5, decimal_places=2)
      stock = models.IntegerField((validators=[MinValueValidator(1), MaxValueValidator(35)]))
      date = models.DateField()
      time_from = models.TimeField()
      time_to = models.TimeField()
  </code></pre>
  
  <p><strong>Base.html</strong></p>
  
  <pre><code>&lt;head&gt;
      &lt;meta charset="UTF-8"&gt;
      &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt;[![enter image description here][1]][1]
      {% load staticfiles %}
      &lt;link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"&gt;
      &lt;link rel="stylesheet" type="text/css" href="{% static 'style.css' %}"&gt;
      &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"&gt;&lt;/script&gt;
      &lt;script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"&gt;&lt;/script&gt;
  &lt;/head&gt;
  </code></pre>
  
  <p><strong>This is how it should work</strong>
  <a href="https://i.stack.imgur.com/YjSb5.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/YjSb5.png" alt="enter image description here"></a></p>
  
  <p><strong>This is how it is now</strong></p>
  
  <p><a href="https://i.stack.imgur.com/ojmlr.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/ojmlr.png" alt="enter image description here"></a></p>