Django and date range picker component for Twitter Bootstrap

Question

I want to use this daterange picker for my Django Project

The problem is that I don't know what I have to do on the server side (Django)?

May be create some kind of widget?

May be subclass widgets.MultiWidget?

I think that this widget have to behave like two DateTimeFields?

Is this possible with Django?

Answer 1

I had to do this; so I share the code here. It basically re-uses Django DateField.

class DateRangeField(forms.DateField):
    def to_python(self, value):
        values = value.split(' - ')
        from_date = super(DateRangeField, self).to_python(values[0])
        to_date = super(DateRangeField, self).to_python(values[1])
        return from_date, to_date

and

date_range = DateRangeField(required=False,
                            widget=forms.TextInput(attrs={'placeholder': _('from'),
                                                          'class': 'form-control datepicker'}))

Answer 2

Given that the example output is

MM/DD/YYYY - MM/DD/YYYY

This is what will post to your view. I would just handle this on your own rather than using a Django Form, and store it in two DateFields. Something along the lines of this:

date_range = request.POST['date_range']
start_date_string = date_range.split(' - ')[0]
end_date_string = date.range.split(' - ')[1]

This will get you your two strings needed, then simply just pass them into the DateFields and save it.