Some of my Django 1.3 models have DateField properties. When a form is generated, I'd like to use the jQuery UI Datepicker instead of a plain text field. I understand that I could create new widgets but I don't understand how. In addition, I am not sure if anything like this has already been done for Django (I googled it, no chance).
How to create a Django Widget that I can reuse across multiple models (and page) for the jQuery UI Datepicker?
JQueryUI has a very good date UI picker.
You can get it here: http://jqueryui.com
Say for example you have the following form:
class DateForm(forms.Form):
myDate = forms.DateField()
From here you want to bind the JQuery date widget to your field from within your template.
I am assuming here you are passing the DateForm
to your template and your path(s) to JQuery are correct.
<head>
<link rel="stylesheet" href="/themes/base/jquery.ui.all.css">
<script src="/jquery.js"></script>
<script src="/ui/jquery.ui.core.js"></script>
<script src="/ui/jquery.ui.widget.js"></script>
<script src="/ui/jquery.ui.datepicker.js"></script>
<script>
$(function() {
$( "#id_myDate" ).datepicker();
});
</script>
</head>
<body>
<p>Date: <input type="text" id="id_myDate"></p>
</body>
Please note that myDate
is preceded by id_
. Django does this transparently so make sure you match it as such: id_myDate
.
Hope this helps you.
You should look on DateInput - you'll need to inherit your widget from it. Also look on admin widgets - there are some JS appended. So take DateInput, add some JS and you're done.