2009-09-20 35 views
11

django newbie tại đây. Tôi có một nỗ lực của một trang đăng ký.django dateTimeWidget không hiển thị

Nó bao gồm các trường văn bản (tên, tên người dùng, mật khẩu, v.v.) và DateField (ngày sinh).

Tôi đang cố sử dụng tiện ích forms.DateTimeInput cho DateField, nhưng khi trang được hiển thị, không có gì xảy ra. Tôi có làm điều gì sai? Điều này có cái gì đó im nhìn? Nó có vẻ khá đơn giản, nhưng tôi không thể làm cho nó hoạt động.

Đây là hình thức của tôi

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 

Và HTML rất đơn giản của tôi

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

Bạn có thể làm rõ? Toàn bộ biểu mẫu không hiển thị hay chỉ là trường DateTime? – David

+0

Các biểu mẫu và 'đầu vào' xuất hiện. Widget lịch của nó không có. – Tom

+0

Khi tôi đọc tiện ích DateInput, tôi cũng mong đợi một điều khiển bộ chọn ngày đồ họa (như trong quản trị django). Tuy nhiên, tôi đoán nó chỉ là một hộp văn bản đơn giản. Không phải IMO trực quan. – User

Trả lời

4

Bạn không nên sử dụng một DateTimeInput với một DateField - hoặc sử dụng một DateInput, hoặc một DateTimeField.

Tuy nhiên, tôi nghi ngờ ý của bạn là 'không có gì xảy ra' là các liên kết cho công cụ chọn ngày lịch không xuất hiện. Đây không phải là một phần của khung biểu mẫu chuẩn và tài liệu không đề xuất rằng chúng xuất hiện với Date/DateTimeInput. Chúng là một phần của ứng dụng quản trị, vì vậy nếu bạn cần chúng trong ứng dụng của riêng bạn, bạn sẽ cần phải bao gồm các tệp javascript một cách rõ ràng.

Cách dễ nhất để thực hiện việc này có thể là sử dụng AdminDateWidget từ django.contrib.admin.widgets, thay vì DateInput. Bạn cũng cần bao gồm tập lệnh jsi18n trong mẫu của mình:

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

Tôi thực sự bối rối về nơi Django là với các vật dụng datetime. Tài liệu ngụ ý cập nhật trong 1.1 nhưng tôi không rõ nó là gì. Nếu tôi có một mẫu đơn như sau:

 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) 
Biểu tượng javascript được tải, nhưng không phải biểu tượng lịch xuất hiện trong biểu mẫu. Sẽ yêu một số rõ ràng xung quanh này như tôi tiếp tục phải quay trở lại jQuery. – PhoebeB

+0

/admin/jsi18n nhu cầu isStaff – goh

6

Bộ chọn ngày theo lịch không phải là một phần của khuôn khổ biểu mẫu.
Bạn tuy nhiên có thể sử dụng jQuery ngày selector phụ tùng

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

On nhấn/chọn hộp sinh nhật, nó sẽ hiển thị một widget selector lịch
Xin vui lòng cho đúng vị trí của jquery.js và jquery-ui.js

10

Tiện ích con Django DateInput không hiển thị bất kỳ nội dung gì ngoại trừ kiểu nhập văn bản thuần túy. Tuy nhiên, nó xác nhận đầu vào của người dùng dựa trên nhiều định dạng khác nhau, vì vậy nó không phải là vô dụng.

Hầu hết mọi người mong đợi ứng dụng hoạt động giống như công cụ chọn ngày được tìm thấy trong giao diện Quản trị Django, do đó, điều này chắc chắn hơi khó hiểu.

Có thể sử dụng AdminDateWidget trong các ứng dụng của riêng bạn, nhưng tôi khuyên bạn nên sử dụng nó. Phải mất a lot of fiddling around to make it work.

Giải pháp dễ nhất là sử dụng một cái gì đó như JQuery UI Datepicker.Đơn giản chỉ cần bao gồm trong <head> trang của bạn:

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

Sau đó, ở phía dưới, đặt dòng sau để kích hoạt datepicker trên các yếu tố đầu vào của bạn:

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

Bạn có thể làm nhiều hơn nữa này một chút DRY nếu bạn có nhiều trường ngày bằng cách tạo ra một widget tùy chỉnh trong bạn 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",) 

Xác định mỗi trường ngày nên sử dụng tiện ích này trong f của bạn orms:

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

Và trong mẫu của bạn, bao gồm những điều sau đây trong <head>:

{{form.media}} 

Và kích hoạt datepicker cho tất cả các lĩnh vực bằng cách đặt sau ở dưới cùng của trang:

<script type="text/javascript"> 
    $(function(){ 
    $(".dateinput").datepicker(); 
    }); 
</script> 
Các vấn đề liên quan