How can I use a calendar visual widget in django form?

Question

I am creating a django application and I have the next problem: I cannot add a calendar widget that works.

I have the next script in my html code:

<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<script>
$(function() {
    $( ".vDateField" ).datepicker();
});
</script>

...

 <form id="ensaioak_bilatu" method="POST" action="/farmaciapp/aukera_menua/ensaio_kontsulta/ensaio_bilaketa/" enctype="multipart/form-data">

        {% csrf_token %}

        {{ formA.as_p }}


        <input class="btn btn-primary" type="submit" name="bilatu_ensaioak" value="Bilatu"/>

    </form>

I also have a model of DateField type fields; and a form like this:

class FormA(forms.ModelForm):


def __init__(self, *args, **kwargs):
    super(FormA, self).__init__(*args, **kwargs)
    # Making name required

    self.fields['date'].required = False

class Meta:
    model = Ensaioa

If I create an object in the html code directly, the calendar widget works, but if try to use the form as I used in the html code above, it doesn't work. Why???

Any idea to fix the problem???

Thank you very much!!!

score 1 · Accepted Answer · answered Jul 02 '15 at 12:29

1

Are you sure your date column has the .vDateField class? Try adding the class to the column:

class FormA(forms.ModelForm):

    def __init__(self, *args, **kwargs):
        super(FormA, self).__init__(*args, **kwargs)
        # Making name required
        self.fields['date'].required = False
        # Adding .vDateField class
        self.fields['date'].widget.attrs = {'class': 'vDateField'}

    class Meta:
        model = Ensaioa

answered Jul 02 '15 at 12:29

César

9,939
6
53
74

1

Thanks!! That was the problem! :))) – jartymcfly Jul 02 '15 at 13:58
The resulting date for the selection of the date with the widget is DD/MM/YYYY. How can I change it to YYYY-MM-DD??? – jartymcfly Jul 02 '15 at 14:02
1

@jfernandez178 take a look at this [question](http://stackoverflow.com/questions/1328025/jquery-ui-datepicker-change-date-format) – César Jul 02 '15 at 16:02

How can I use a calendar visual widget in django form?

1 Answers1