[Django]-Django form.as_p DateField not showing input type as date

62👍

✅

You can create a custom widget:

from django import forms

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

class MyModelForm(forms.ModelForm):
    class Meta:
        model = MyModel
        fields = '__all__'
        widgets = {
            'my_date': DateInput()
        }

50👍

There’s no need to subclass DateInput.

class MyModelForm(forms.ModelForm):
    class Meta:
        model = MyModel
        fields = '__all__'
        widgets = {
            'my_date': forms.DateInput(attrs={'type': 'date'})
        }

12👍

start_date = forms.DateField(widget=forms.DateInput(attrs={'type': 'date'}))

5👍

Using the django-widget-tweaks package you can do this pretty simply by using:

{% load widget_tweaks %}
{{form.date|attr:"type:date"}}

and making the field a date time field in your class:

date = forms.DateField()

1👍

forms.py

from django import forms
from .models import MyModel
from django.forms.widgets import DateInput # need to import

class MyForm(forms.ModelForm):
    class Meta:
        model = MyModel
        fields = '__all__'
        widgets = {
            'my_date': DateInput(attrs={'type': 'date'})
        }

1👍

You can specify type attribute in attrs dictionary which you want.

class AddProduct(forms.Form):
        name        = forms.CharField(widget=forms.TextInput(attrs={'class' : 'form-control'}), required=True)
        amount      = forms.DecimalField(widget=forms.NumberInput(attrs={'class' : 'form-control'}), required=True)
        product_mfg = forms.CharField(widget=forms.DateInput(attrs={'class' : 'form-control', 'type':'date'}), required=True)
        product_exp = forms.DateField(widget=forms.DateInput(attrs={'class' : 'form-control', 'type':'date'}), required=True)
        department  = forms.CharField(widget=forms.Select(attrs={'class' : 'form-control'}), required=True)

0👍

To use directly in forms.Form

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

class Gym(forms.Form):
    starting_date = forms.DateField(widget = DateInput)

0👍

If we don’t use ModelForm rather if we use django.views.generic.edit.CreateView only, there is a way for converting the default type of the input field (from text to date).

class MyModelCreateView(CreateView):
    model = MyModel
    ...

    def get_form(self):
        form = super().get_form()
        form.fields['my_date'].widget = forms.DateInput(attrs={'type': 'date'})
        return form

This will render the input field like this,

<input type="date" name="my_date" required="" id="id_my_date">

-1👍

Installation

  • Run pip install django-datetimepicker
  • Add 'datetimepicker' to your INSTALLED_APPS

Basic usage

Here is an example of how to use the widget.

. Assign the DateTimePicker to a DateTimeField, DateField or TimeField.

from django import forms
from datetimepicker.widgets import DateTimePicker


class SampleForm(forms.Form):
     datetime = forms.DateTimeField(widget=DateTimePicker(),)

Leave a comment