Django表单模型中的DateTime字段

When using DateTimeField in ModelForms, they look like text fields. How can I make them look like in the admin? (When I go to the admin and add a show I see the fields as date fields)

在ModelForms中使用DateTimeField时，它们看起来像文本字段。如何让他们看起来像在管理员？（当我转到管理员并添加一个节目时，我将字段视为日期字段）

# 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})

In the template:

在模板中：

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

2 个解决方案

#1

You can do this with django widgets. It is very simple and easy to implement. Bellow are the details how you can use this using widgets.

你可以用django小部件来做到这一点。它非常简单易实现。 Bellow是如何使用小部件来使用它的详细信息。

in forms.py

在forms.py中

from django.contrib.admin import widgets

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

in template

在模板中

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

This is it. Please let me know if i am not much clear. Or you are facing any error in it.

就是这个。如果我不太清楚，请告诉我。或者您正面临任何错误。

#2

You should probably use something like jQuery UI's datepicker widget:

您可能应该使用类似jQuery UI的datepicker小部件：

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.

datepicker绑定到标准表单输入字段。关注输入（单击或使用Tab键）以小叠加打开交互式日历。选择日期，单击页面上的其他位置（模糊输入），或按Esc键关闭。如果选择日期，则反馈显示为输入值。

#1