<div class="input-group mb-3 date date-field">
  <label class="sr-only" for="{{ form.birthdate.id_for_label }}">{{ form.birthdate.label }}</label>
  <div class="input-group date date-field" data-target-input="nearest"
       id="{{ form.birthdate.id_for_label }}-input-group">
    <input class="form-control datetimepicker-input{% if form.birthdate.errors %} is-invalid{% endif %}"
           data-target="#{{ form.birthdate.id_for_label }}-input-group"
           id="{{ form.birthdate.id_for_label }}"
           name="{{ form.birthdate.html_name }}"
           placeholder="{{ form.birthdate.label }}"
           type="text"
           value="{{ form.birthdate.value|default_if_none:'' }}"/>
    <div class="input-group-append" data-target="#{{ form.birthdate.id_for_label }}-input-group"
         data-toggle="datetimepicker">
      <div class="input-group-text"><i class="fa fa-calendar"></i></div>
    </div>
  </div>
  {% if form.birthdate.errors %}
  <div class="invalid-feedback" id="{{ form.birthdate.id_for_label }}-feedback">
    {{ form.birthdate.errors.as_ul }}
  </div>
  {% endif %}
</div>


