2009-09-20 15 views
11

nowości django. Mam próbę strony rejestracji.django dateTimeWidget nie wyświetla się tutaj

Składa się z pól tekstowych (nazwa, nazwa użytkownika, hasło itp.) Oraz DataField (data ur.).

Próbuję użyć widgetu forms.DateTimeInput dla DateField, ale gdy strona jest renderowana, nic się nie dzieje. Czy robię coś źle? Czy to ma coś z widokiem? Wydaje się to dość proste, ale nie mogę go uruchomić.

To moja forma

class RegisterForm(forms.Form): 
    username = forms.CharField(max_length= 50) 
    password = forms.CharField(label=u'Password',widget = forms.PasswordInput(render_value=False))#password 

    birthday = forms.DateField(required=False,initial=datetime.date.today,widget = forms.DateTimeInput())#25 Oct 2006 

A mój bardzo prosty HTML

<form action="" method = "POST"> 
{{ form.as_p}} 
<input type='Submit' value='Register'/> 
</form> 
+0

Czy mógłbyś wyjaśnić? Czy cały formularz nie renderuje się, czy tylko pole DateTime? – David

+0

Pojawiają się formularze i "dane wejściowe". Jest to widget kalendarza, który nie robi. – Tom

+0

Kiedy czytam widżet DateInput, też oczekiwałem graficznej kontroli wyboru daty (jak w administratorze django). Jednak myślę, że to zwykłe pole tekstowe. Nie intuicyjne IMO. – User

Odpowiedz

4

Nie należy używać DateTimeInput z DateField - albo użyć DateInput, lub DateTimeField.

Podejrzewam jednak, że określenie "nic się nie dzieje" oznacza, że ​​linki do selektora daty kalendarza nie są wyświetlane. Nie są one częścią standardowego frameworka formularzy, a dokumentacja nie sugeruje, że pojawiają się one z parametrem Date/DateTimeInput. Są częścią aplikacji administratora, więc jeśli potrzebujesz ich w swojej aplikacji, musisz jawnie dołączyć pliki javascript.

Najprostszym sposobem na to jest prawdopodobnie użycie AdminDateWidget z django.contrib.admin.widgets, zamiast DateInput. Należy również uwzględnić w szablonie skrypt jsi18n:

<script type="text/javascript" src="/admin/jsi18n/"></script> 
+0

Jestem naprawdę zdezorientowany tym, gdzie Django ma widżety datetime. Dokumenty sugerują aktualizację w wersji 1.1, ale nie wiem, co to jest. Jeśli mam taki formularz:

 class EventForm(forms.ModelForm): summary = forms.CharField(label="Event Name", widget=forms.TextInput(attrs={'size':'40'})) dtstart = forms.DateTimeField(widget=AdminDateWidget()) dtend = forms.DateTimeField(widget=AdminDateWidget) 
Jądro JavaScript jest ładowany, ale w formularzu nie pojawia się ikona kalendarza. Chciałbym trochę jasności wokół tego, ponieważ wciąż muszę wrócić do jQuery. – PhoebeB

+0

/admin/jsi18n potrzebuje isStaff – goh

6

Selektor daty kalendarza nie jest częścią struktury formularzy.
Można jednak użyć jQuery widżet wyboru daty

<script type="text/javascript" src="{{ MEDIA_URL }}js/jquery-min.js"></script> 
<!-- give correct location for jquery.js --> 
<script type="text/javascript" src="{{ MEDIA_URL }}js/jquery-ui-min.js"></script> 
<!-- give correct location for jquery-ui.js --> 
<script type="text/javascript"> 
    jQuery(function() { 
     jQuery("#id_birthday").datepicker({ dateFormat: 'yy-mm-dd' }); 
    }); 
</script> 
<form method="post"> 
    {{ form.as_p }} 
    <input type="submit" value="Create Phase" /> 
</form> 

Na klikając/zaznaczając pole tekstowe urodziny, to pokaże widżet wyboru kalendarz
Proszę podać poprawną lokalizację swojego jquery.js i jQuery ui.js

10

Widżet Django DateInput nie wyświetla niczego poza wprowadzeniem zwykłego tekstu. Sprawdza jednak dane wejściowe użytkownika w różnych formatach, więc nie jest bezużyteczne.

Większość ludzi oczekiwałaby, że będzie się zachowywać w taki sam sposób, jak selektor dat w interfejsie administratora Django, więc jest to z pewnością trochę mylące.

Możliwe jest użycie AdminDateWidget we własnych aplikacjach, ale odradzam. Zajmuje a lot of fiddling around to make it work.

Najprostszym rozwiązaniem jest użycie czegoś takiego jak JQuery UI Datepicker.Po prostu obejmują następujące w <head> swojej stronie:

<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> 

potem na dole umieścić następującą linię do aktywacji datepicker na swoich elementów wejściowych:

<script type="text/javascript"> 
    $(function(){ 
    $("#id_birthday").datepicker(); 
    }); 
</script> 

Można zrobić to trochę więcej DRY jeśli masz wiele date pól poprzez tworzenie niestandardowych widget na swojej 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",) 

określić każde pole data powinna wykorzystać ten widget w swojej f ORMs:

birthday = forms.DateField(label="Birthday", widget=JQueryUIDatepickerWidget) 

A w szablonie, obejmują następujące w <head>:

{{form.media}} 

i włączyć datepicker dla wszystkich pól, umieszczając następujące u dołu strony:

<script type="text/javascript"> 
    $(function(){ 
    $(".dateinput").datepicker(); 
    }); 
</script> 
Powiązane problemy