Categories
Python Answers

How to show datepicker calendar on datefield with Python Django?

Spread the love

Sometimes, we want to show datepicker calendar on datefield with Python Django.

In this article, we’ll look at how to show datepicker calendar on datefield with Python Django.

How to show datepicker calendar on datefield with Python Django?

To show datepicker calendar on datefield with Python Django, we can add a date input into the form template.

For instance, we write

from django import forms
class HolidayTimeForm(forms.Form):
    holiday_date = forms.DateField(widget=forms.TextInput(attrs=
                                {
                                    'class':'datepicker'
                                }))

to add a date field into our form.

And then in our form’s template, we add

<script>
  $(function () {
    $(".datepicker").datepicker({
      changeMonth: true,
      changeYear: true,
      yearRange: "1900:2022",
      // ...
    });
  });
</script>

to call jQuery UI’s datepicker method to turn the element with class datepicker into a date picker.

Conclusion

To show datepicker calendar on datefield with Python Django, we can add a date input into the form template.

By John Au-Yeung

Web developer specializing in React, Vue, and front end development.

Leave a Reply

Your email address will not be published. Required fields are marked *