Il widget Django DateInput non esegue alcun rendering se non un semplice inserimento di testo. Tuttavia, convalida l'input dell'utente su una varietà di formati, quindi non è inutile.
La maggior parte delle persone si aspetterebbe che si comportasse nello stesso modo del selettore di date trovato nell'interfaccia di Django Admin, quindi è sicuramente un po 'di confusione.
È possibile utilizzare AdminDateWidget nelle proprie app, ma vorrei sconsigliarlo. Ci vuole a lot of fiddling around to make it work.
La soluzione più semplice è utilizzare qualcosa come JQuery UI Datepicker.È sufficiente inserire il seguente nel <head>
della pagina:
<link type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/redmond/jquery-ui.css" rel="Stylesheet" />
<script language="javascript" type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/jquery-ui.min.js"></script>
Poi in fondo, mettere la seguente riga per attivare la Datepicker sui vostri elementi di input:
<script type="text/javascript">
$(function(){
$("#id_birthday").datepicker();
});
</script>
Si può fare di questo un po 'di più DRY se si dispone di molti campi data con la creazione di un widget personalizzato nel forms.py
:
class JQueryUIDatepickerWidget(forms.DateInput):
def __init__(self, **kwargs):
super(forms.DateInput, self).__init__(attrs={"size":10, "class": "dateinput"}, **kwargs)
class Media:
css = {"all":("http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/redmond/jquery-ui.css",)}
js = ("http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js",
"http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/jquery-ui.min.js",)
Specificare ogni campo data dovrebbe usare questo widget nella vostra f ORM:
birthday = forms.DateField(label="Birthday", widget=JQueryUIDatepickerWidget)
E nel tuo modello, includono quanto segue nel <head>
:
{{form.media}}
e attivare il Datepicker per tutti i campi mettendo quanto segue alla parte inferiore della pagina:
<script type="text/javascript">
$(function(){
$(".dateinput").datepicker();
});
</script>
Potrebbe chiarire? L'intero modulo non viene visualizzato, o solo il campo DateTime? – David
Vengono visualizzati i moduli e gli "input". È il widget del calendario che non lo fa. – Tom
Quando ho letto il widget DateInput, mi sarei aspettato un controllo grafico per la selezione delle date (come nell'amministratore di django). Tuttavia, immagino sia solo una semplice casella di testo. IMO non intuitivo. – User