Pole DateTime w modelu formularza Django

Question

Podczas korzystania z DateTimeField w ModelForm s wyglądają one jak pola tekstowe. Jak mogę sprawić, aby wyglądały jak w administratorze? (Kiedy idę do administratora i dodać pokaz widzę pola jak pola data)

# models.py 
class Show(models.Model): 
    ... 
    start_time = models.DateTimeField("Event Time") 
    sale_end_time = models.DateTimeField("Sale End Time") 

class ShowForm(ModelForm): 

    class Meta: 
     model = Show 

# views.py 
def createshow(request): 
    if request.method == 'POST': 
     form = ShowForm(request.POST) 
     if form.is_valid(): 
      form.save() 
      return HttpResponseRedirect('/showsaved') 
    else: 
     form = ShowForm() 
     return render(request, 'BizCreateShow.html', {'ShowForm' : form}) 

W szablonie:

<form class="form-horizontal well" action="" method="post"> 
{% csrf_token %} 
    {{ ShowForm }} </br> 
    <input type="submit" value="Submit"> 
</form> 

Answer 1

Można to zrobić za pomocą widgetów Django. Jest bardzo prosty i łatwy do wdrożenia. Poniżej znajdziesz szczegółowe informacje na temat tego, jak możesz korzystać z tego przy użyciu widżetów.

w forms.py

class ShowForm(ModelForm): 
    class Meta: 
     model = Show 
    def __init__(self, *args, **kwargs): 
     super(ShowForm, self).__init__(*args, **kwargs) 
     self.fields['start_time'].widget = widgets.AdminSplitDateTime() 
     self.fields['sale_end_time'].widget = widgets.AdminSplitDateTime() 

w szablon

<script type="text/javascript" src="/my_admin/jsi18n/"></script> 
<script type="text/javascript" src="/media/admin/js/core.js"></script> 

<link rel="stylesheet" type="text/css" href="/media/admin/css/forms.css"/> 
<link rel="stylesheet" type="text/css" href="/media/admin/css/base.css"/> 
<link rel="stylesheet" type="text/css" href="/media/admin/css/global.css"/> 
<link rel="stylesheet" type="text/css" href="/media/admin/css/widgets.css"/> 

To jest to. Daj mi znać, jeśli nie jestem zbyt jasny. Lub stoisz przed jakimkolwiek błędem w nim.

Answer 2

Należy prawdopodobnie użyć czegoś podobnego jQuery UI datepicker widget:

The datepicker is tied to a standard form input field. Focus on the input (click, or use the tab key) to open an interactive calendar in a small overlay. Choose a date, click elsewhere on the page (blur the input), or hit the Esc key to close. If a date is chosen, feedback is shown as the input's value.