Basic - adding jquery plugin to django form

Question

I'm looking for a solution to this basic problem: I'm using a jquery plugin (datepicker) to let users pick a date. How should this be used in the django form?

A formset doesn't seem the right solution, but neither does making and calling my own widget. Rather than continue to try new options, I'm looking for some direction. Here is a simple test scenario.

models.py

    class DateTest(models.Model):
        date_nm = models.CharField(max_length=120)
        fromdate = models.DateTimeField()

forms.py

def datetest_save_page(request):
    if request.method == 'POST': 
        form = DateTestSaveForm(request.POST)
        if form.is_valid():
            date_nm, dummy = DateTest.objects.get_or_create(
                date_nm=form.cleaned_data['date_nm']
            )
            fromdate = form.cleaned_data['fromdate']
            return HttpResponseRedirect('datetest_page.html') 
    else:
        form = DateTestSaveForm()
    return render_to_response('datetest_save.html', {
        'form': form,
    })

forms.py

class DateTestSaveForm(forms.Form):
    date_nm = forms.CharField(
        label=u'Date Name',
        max_length=30
    )
    fromdate = forms.DateTimeField()

I have my datepicker set up in my base.html and called in datetest_save.html. It calls and I can pick a date just find, but I don't know how to take the date that I select and stick it into my database.

Thanks for your help.

score 0 · Accepted Answer · answered Jul 09 '12 at 21:36

0

There's actually quite a few jQuery plugins named "datepicker" so it's hard to know which you might be using here. However, if you don't want to create a custom form field, you'll need to find a library that offers someway to customize the date format used. Specifically, the field value will need to be in the format: "YYYY-MM-DD".

If you can't or otherwise don't want to have the date in that format, then you'll have to create a custom form field that will automatically parse your chosen date format into something usable by Django.

answered Jul 09 '12 at 21:36

Chris Pratt

232,153
36
385
444

disregard above: Thanks Chris. This is the what I need - a [custom form field](http://stackoverflow.com/questions/1526806/tutorial-about-how-to-write-custom-form-fields-in-django) is the answer I'm looking for. That said, I've looked through a bunch of documentation and still only have a vague notion of how to connect the [jquery datepicker](http://jqueryui.com/demos/datepicker/) to a custom form field. I know I need to create a class that handles my data, then call that class later in the form. But, still not sure about the syntax of the class and how my datepicker is referenced. Thanks. – jabs Jul 10 '12 at 21:19

score 0 · Answer 2 · answered Jul 16 '12 at 23:24

Sounds like you are referring to the jQuery UI datepicker. You can set the format of the datepicker.

Also, you do NOT need to create a custom field for the input of Date/Time. And do you mean to be using the DateTimeField? If you just need the date then you can use the DateField in forms and Models.

To set the input format of a DateField you can do this:

fromdate = forms.DateField(input_formats=['%Y-%m-%d'])

See this for more details.

If you want to provide the format in which the field should be formatted you can do:

fromdate = forms.DateField(input_formats=['%Y-%m-%d'],
                           widget=forms.DateInput(format='%Y-%m-%d'))

See this for details regarding format.

Notes:

It is best to use YYYY-MM-DD format since the new HTML5 date field only allow you to use this format.

Also, you could use ModelForms for your forms.

Thanks Maqsood. Yes, it's the [UI datepicker](http://jqueryui.com/demos/datepicker/). But the question is less about how to format it (but thanks for the html5 tip), it's more about connecting the datepicker to my form. There is a disconnect them and I don't know how to link them up. I can call the datepicker in my html and make it show up in the page, but it doesn't post to the db because it's not referenced in the form. How do I do that? — jabs, Jul 17 '12 at 11:14

Basic - adding jquery plugin to django form

2 Answers2