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?
An input element that is to be updated with the selected date from the datepicker. Use the altFormat option to change the format of the date within this field.
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.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With