title: How to use DatetimeField in Django 2 models and Templates
body: <p>I'm working on a project in which I need to use a few DateTime fields, I have defined <code>DatetimeField</code> in my model and then in the template, I'm using the <a href="https://tempusdominus.github.io/bootstrap-4/" rel="nofollow noreferrer">https://tempusdominus.github.io/bootstrap-4/</a> plugin but when I submit the form there are two issues comes on:</p>
  
  <p>1): Django says <code>Enter a valid date/time</code> for all DateTime Fields
  2): Select a valid choice. <code>['corn_oil']</code> is not one of the available choices.</p>
  
  <p>Here's what I have tried:</p>
  
  <p><strong>From <code>models.py</code>:</strong></p>
  
  <pre><code>choices = (
      ('CO2 SCRUBBER', 'CO2 SCRUBBER'),
      ('corn_oil', 'CORN OIL'),
      ('DRYERS', 'DRYERS'),
      ('ENVIRONMENTAL', 'ENVIRONMENTAL'),
      ('UTILITIES', 'UTILITIES'),
      ('LAB', 'LAB'),
      ('SIEVES', 'SIEVES'),
      ('GRAINS &amp; MILLING', 'GRAINS &amp; MILLING'),
      ('SEPARATION', 'SEPARATION'),
      ('AIR &amp; GAS', 'AIR &amp; GAS'),
      ('COOK', 'COOK'),
      ('EVAPORATION', 'EVAPORATION'),
      ('WATER', 'WATER'),
      ('STORAGE', 'STORAGE'),
      ('BOILER', 'BOILER'),
      ('FERMENTATION', 'FERMENTATION'),
      ('DISTILLATION', 'DISTILLATION'),
      ('BUILDING AND FACILITIES', 'BUILDING AND FACILITIES'),
      ('CHEMICAL', 'CHEMICAL'),
  )
  
  
  class ExperimentModel(models.Model):
      user = models.ForeignKey(User, related_name='experiments',
                               on_delete=models.CASCADE)
      name = models.CharField(max_length=255)
      start_date = models.DateTimeField()
      change_date = models.DateTimeField()
      end_date = models.DateTimeField()
      assets = models.CharField(max_length=450, choices=choices)
      goals = models.CharField(max_length=255, blank=True)
      comments = models.TextField(max_length=1000)
      created_at = models.DateTimeField(auto_now=True)
  </code></pre>
  
  <p><strong>From <code>forms.py</code>:</strong></p>
  
  <pre><code>class ExperimentForm(forms.ModelForm):
      choices = (
          ('CO2 SCRUBBER', 'CO2 SCRUBBER'),
          ('corn_oil', 'CORN OIL'),
          ('DRYERS', 'DRYERS'),
          ('ENVIRONMENTAL', 'ENVIRONMENTAL'),
          ('UTILITIES', 'UTILITIES'),
          ('LAB', 'LAB'),
          ('SIEVES', 'SIEVES'),
          ('GRAINS &amp; MILLING', 'GRAINS &amp; MILLING'),
          ('SEPARATION', 'SEPARATION'),
          ('AIR &amp; GAS', 'AIR &amp; GAS'),
          ('COOK', 'COOK'),
          ('EVAPORATION', 'EVAPORATION'),
          ('WATER', 'WATER'),
          ('STORAGE', 'STORAGE'),
          ('BOILER', 'BOILER'),
          ('FERMENTATION', 'FERMENTATION'),
          ('DISTILLATION', 'DISTILLATION'),
          ('BUILDING AND FACILITIES', 'BUILDING AND FACILITIES'),
          ('CHEMICAL', 'CHEMICAL'),
      )
      assets = forms.MultipleChoiceField(widget=forms.CheckboxSelectMultiple,
                                         choices=choices)
      # assets = ModelMultipleChoiceField(queryset=Thing.objects.all(), widget=Select2MultipleWidget)
  
      class Meta:
          model = ExperimentModel
          fields = ('user', 'name', 'start_date', 'change_date', 'end_date', 'assets',
                    'goals', 'comments')
  </code></pre>
  
  <p><strong>From <code>views.py</code>:</strong>
      def post(self, request, *args, **kwargs):
          post_data = request.POST.copy()
          post_data.update({'user': request.user.pk})
          form = ExperimentForm(post_data)
          if request.method == 'POST':
              print('req submitted')
              if form.is_valid():
                  print('form valid')
                  form.save(commit=False)
                  form.user = request.user
                  form.save()
                  return HttpResponseRedirect('all-experiments')
              return render_to_response('experiment/new_experiment.html', {'form': form})</p>
  
  <p>And here how I'm displaying the DateTime field and choices field in my template:
  <strong>From <code>new-experiment.html</code>:</strong></p>
  
  <pre><code>&lt;div class="form-group"&gt;
                  &lt;input type="text" name="name" id="name" class="form-control input-lg"
                         placeholder="experiment name" tabindex="3" required&gt;
              &lt;/div&gt;
              &lt;div class="form-group"&gt;
                  &lt;label for="datetimepicker1"&gt; Start Date &lt;/label&gt;
                  &lt;div class="input-group date" id="datetimepicker1" data-target-input="nearest"&gt;
                      &lt;input type="text" name="start_date" class="form-control datetimepicker-input"
                             data-target="#datetimepicker1"/&gt;
                      &lt;div class="input-group-append" data-target="#datetimepicker1" data-toggle="datetimepicker"&gt;
                          &lt;div class="input-group-text"&gt;&lt;i class="fa fa-calendar"&gt;&lt;/i&gt;&lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
              &lt;div class="form-group"&gt;
                  &lt;label for="datetimepicker2"&gt; Change Date &lt;/label&gt;
                  &lt;div class="input-group date" id="datetimepicker2" data-target-input="nearest"&gt;
                      &lt;input type="text" name="change_date" class="form-control datetimepicker-input"
                             data-target="#datetimepicker2"/&gt;
                      &lt;div class="input-group-append" data-target="#datetimepicker2" data-toggle="datetimepicker"&gt;
                          &lt;div class="input-group-text"&gt;&lt;i class="fa fa-calendar"&gt;&lt;/i&gt;&lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
              &lt;div class="form-group"&gt;
                  &lt;label for="datetimepicker3"&gt; End Date &lt;/label&gt;
                  &lt;div class="input-group date" id="datetimepicker3" data-target-input="nearest"&gt;
                      &lt;input type="text" name="end_date" class="form-control datetimepicker-input"
                             data-target="#datetimepicker3" placeholder="dd/mm/yy"/&gt;
                      &lt;div class="input-group-append" data-target="#datetimepicker3" data-toggle="datetimepicker"&gt;
                          &lt;div class="input-group-text"&gt;&lt;i class="fa fa-calendar"&gt;&lt;/i&gt;&lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
  
              &lt;script type="text/javascript"&gt;
                  $(function () {
                      $('#datetimepicker1').datetimepicker();
                      $('#datetimepicker2').datetimepicker();
                      $('#datetimepicker3').datetimepicker();
                  });
              &lt;/script&gt;
              &lt;div class="form-group"&gt;
                  &lt;label for="assets"&gt; Assets &lt;/label&gt;
                                  &lt;input type="text" name="assets" id="assets" class="form-control input-lg"
                                         placeholder="Assets" tabindex="3" required&gt;
                  &lt;select name="assets" class="form-control select_field_class" id="assets"&gt;
                      &lt;option value="CO2 SCRUBBER"&gt;CO2 SCRUBBER&lt;/option&gt;
                      &lt;option value="corn_oil"&gt;CORN OIL&lt;/option&gt;
                      &lt;option value="DRYERS"&gt;DRYERS&lt;/option&gt;
                      &lt;option value="ENVIRONMENTAL"&gt;ENVIRONMENTAL&lt;/option&gt;
                      &lt;option value="UTILITIES"&gt;UTILITIES&lt;/option&gt;
                      &lt;option value="LAB"&gt;LAB&lt;/option&gt;
                      &lt;option value="SIEVES"&gt;SIEVES&lt;/option&gt;
                      &lt;option value="GRAINS &amp; MILLING"&gt;GRAINS &amp; MILLING&lt;/option&gt;
                      &lt;option value="SEPARATION"&gt;SEPARATION&lt;/option&gt;
                      &lt;option value="AIR &amp; GAS"&gt;AIR &amp; GAS&lt;/option&gt;
                      &lt;option value="COOK"&gt;COOK&lt;/option&gt;
                      &lt;option value="EVAPORATION"&gt;EVAPORATION&lt;/option&gt;
                      &lt;option value="WATER"&gt;WATER&lt;/option&gt;
                      &lt;option value="STORAGE"&gt;STORAGE&lt;/option&gt;
                      &lt;option value="BOILER"&gt;BOILER&lt;/option&gt;
                      &lt;option value="FERMENTATION"&gt;FERMENTATION&lt;/option&gt;
                      &lt;option value="BUILDING AND FACILITIES"&gt;BUILDING AND FACILITIES&lt;/option&gt;
                      &lt;option value="CHEMICAL"&gt;CHEMICAL&lt;/option&gt;
                  &lt;/select&gt;
              &lt;/div&gt;
              &lt;div class="form-group"&gt;
                  &lt;label for="assets"&gt; Goals &lt;/label&gt;
                  &lt;input type="text" name="goals" id="goals" class="form-control input-lg"
                         placeholder="Goals" tabindex="3" required&gt;
              &lt;/div&gt;
              &lt;div class="form-group"&gt;
                  &lt;label for="comments"&gt; Comments &lt;/label&gt;
                  &lt;textarea name="comments" id="comments" class="form-control input-lg"
                            rows="5" required&gt;
                      &lt;/textarea&gt;
              &lt;/div&gt;
  </code></pre>
  
  <p>I want to use multi-select for assets also, but not achieved yet.</p>
  
  <p>Helm me, please!</p>
  
  <p>Thanks in advance!</p>