Django DateTimeInput 类型 'datetime-local' 未保存到数据库
Django DateTimeInput Type 'datetime-local' Not Saving To Database
我正在开发一个 django 应用程序来记录交易。所有交易文档都在一页上完成,并带有一个内联表单集,显示了交易的所有进入和退出。在 datetimeinput 字段之前,一切都很好。如果我删除 'type' 表单效果很好,但对用户非常不友好。
没有'type'的工作条目
具有 'type' 的非工作条目:'datetime-local'
所以我猜你可以说 datetime-local 造成了几个问题,或者这不是 datetime-local 的责任。我已经坚持了一整天,我真的不确定问题出在哪里:
- Entry.date 值不再填充到字段中
- 在日期时间选择器中选择新的日期和时间时,它不会保存
- datetime-local 删除了秒数,我们需要秒数
models.py
from django.db.models.functions import datetime
class Entry(models.Model):
ENTRY = 'entry'
EXIT = 'exit'
ENTRY_TYPE_CHOICES = [
(ENTRY, 'Entry'),
(EXIT, 'Exit'),
]
class Meta:
verbose_name = "Entry"
verbose_name_plural = "Entries"
trade = models.ForeignKey(Trade, on_delete=models.CASCADE)
date = models.DateTimeField(null=True, blank=True, default=datetime.datetime.now)
amount = models.FloatField(null=True)
price = models.FloatField(null=True, blank=True)
fee = models.FloatField(null=True, blank=True)
entry_type = models.CharField(max_length=5, choices=ENTRY_TYPE_CHOICES, default=ENTRY)
forms.py
class EntriesForm(ModelForm):
class Meta:
model = Entry
exclude = ()
widgets = {
'date': forms.DateTimeInput(attrs={'type':'datetime-local', 'class':'form-control'}),
}
EntriesFormSet = inlineformset_factory(Trade, Entry, form=EntriesForm, extra=1)
views.py
class TradeUpdateView(UpdateView):
model = Trade
form_class = CreateForm
success_url = reverse_lazy('trade-list')
def get_context_data(self, **kwargs):
data = super(TradeUpdateView, self).get_context_data(**kwargs)
if self.request.POST:
data['entries'] = EntriesFormSet(self.request.POST, instance=self.object)
else:
data['entries'] = EntriesFormSet(instance=self.object)
return data
def form_valid(self, form):
form.instance.user = self.request.user
form.instance.created_by = self.request.user
context = self.get_context_data()
entries = context['entries']
with transaction.atomic():
self.object = form.save()
if entries.is_valid():
entries.instance = self.object
entries.save()
return super(TradeUpdateView, self).form_valid(form)
trade_form.html
{% extends 'dashboard/base.html' %}
{% load static %}
{% block content %}
<script type="text/javascript" src="{% static 'vendor/jquery/jquery.js' %}"></script>
<script type="text/javascript" src="{% static 'admin/js/vendor/jquery/jquery.js' %}"></script>
<!-- Page Heading -->
<div class="d-sm-flex align-items-center justify-content-between mb-3">
<h2>New Trade</h2>
</div>
<div class="row">
<div class="col">
<form action="" method="post">{% csrf_token %}
{{ form.as_p }}
<table class="table">
{{ entries.management_form }}
{% for form in entries.forms %}
{% if forloop.first %}
<thead>
<tr>
{% for field in form.visible_fields %}
<th>{{ field.label|capfirst }}</th>
{% endfor %}
</tr>
</thead>
{% endif %}
<tr class="{% cycle row1 row2 %} formset_row">
{% for field in form.visible_fields %}
<td>
{# Include the hidden fields in the form #}
{% if forloop.first %}
{% for hidden in form.hidden_fields %}
{{ hidden }}
{% endfor %}
{% endif %}
{{ field.errors.as_ul }}
{{ field }}
</td>
{% endfor %}
</tr>
{% endfor %}
</table>
<input type="submit" value="Save"/> <a href="{% url 'trade-list' %}">back to the list</a>
</form>
</div>
</div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="{% static 'js/formset/jquery.formset.js' %}"></script>
<script type="text/javascript">
$('.formset_row').formset({
addText: 'add entry',
deleteText: 'remove',
prefix: 'entry_set'
});
</script>
{% endblock content %}
带有 type=datetime-local
的字段提交的格式似乎不是 Django 接受的格式,在我的本地测试中导致表单无法保存。有可能将字段的日期时间格式添加到 django 在设置文件中使用 DATETIME_INPUT_FORMATS
接受的格式(请参阅 https://docs.djangoproject.com/en/3.0/ref/settings/#std:setting-DATETIME_INPUT_FORMATS)。但是,如果您正在使用本地化(即在您的设置中使用 USE_L10N = True
),则 DATETIME_INPUT_FORMATS 似乎未被使用(根据我的测试 - 我没有查看底层代码)。在我花费的(诚然有限的)时间里,我无法让 DATETIME_INPUT_FORMATS 产生任何效果。
鉴于对 datetime-local
的支持非常有限,并且在任何情况下都难以让 django 接受结果,我建议您考虑使用日期时间小部件,它可以为您提供更多控制和更好的跨浏览器兼容性。 Flatpickr (https://flatpickr.js.org/).
似乎(截至 2020 年 2 月)需要维护且依赖性非常有限的一个。
在您的情况下,要使用 Flatpickr,您需要在相关 HTML 文件的顶部包含:
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css">
<script src="https://cdn.jsdelivr.net/npm/flatpickr"></script>
<script>
// This code activates flatpickr on fields with the 'datetimefield' class when the document has loaded
window.addEventListener("DOMContentLoaded", function () {
flatpickr(".datetimefield", {
enableTime: true,
enableSeconds: true,
dateFormat: "Y-m-d H:i:S",
});
});
</script>
并更改:
widgets = {
'date': forms.DateTimeInput(attrs={'type':'datetime-local', 'class':'form-control'}),
}
到
widgets = {
'date': forms.DateTimeInput(format='%Y-%m-%d %H:%M:%S', attrs={'class':'datetimefield'}),
}
这将导致 django 生成的字段具有同样为 flatpickr 配置的格式(基于上面字段中的文本,一个 django 接受)。
您可以使用许多其他日期选择器小部件,并且由于您已经在使用 jquery,因此具有 jquery 依赖项对您来说不一定是个大问题。
可能有点晚了,但我遇到了类似的问题,我使用的是模型表单,Django 在 html 表单中设置了无效的日期时间值(至少 Chrome)元素。看看你的是否也在做同样的事情 - 查看源代码。
解决方案是设置日期格式,以便在 html 元素的日期和时间部分之间插入一个 T:
widgets = {
# NOTE the form element needs "2021-01-01T12:00:00" BUT by default it's like: "2021-01-01 12:00:00"
'start_time': DateTimeInput(format='%Y-%m-%dT%H:%M:%S', attrs={'type': 'datetime-local'}),
'end_time': DateTimeInput(format='%Y-%m-%dT%H:%M:%S', attrs={'type': 'datetime-local'}),
}
顺便说一句,现在建议使用 datetime-local
而不是 datetime
(已弃用):mozilla page
我正在开发一个 django 应用程序来记录交易。所有交易文档都在一页上完成,并带有一个内联表单集,显示了交易的所有进入和退出。在 datetimeinput 字段之前,一切都很好。如果我删除 'type' 表单效果很好,但对用户非常不友好。
没有'type'的工作条目
具有 'type' 的非工作条目:'datetime-local'
所以我猜你可以说 datetime-local 造成了几个问题,或者这不是 datetime-local 的责任。我已经坚持了一整天,我真的不确定问题出在哪里:
- Entry.date 值不再填充到字段中
- 在日期时间选择器中选择新的日期和时间时,它不会保存
- datetime-local 删除了秒数,我们需要秒数
models.py
from django.db.models.functions import datetime
class Entry(models.Model):
ENTRY = 'entry'
EXIT = 'exit'
ENTRY_TYPE_CHOICES = [
(ENTRY, 'Entry'),
(EXIT, 'Exit'),
]
class Meta:
verbose_name = "Entry"
verbose_name_plural = "Entries"
trade = models.ForeignKey(Trade, on_delete=models.CASCADE)
date = models.DateTimeField(null=True, blank=True, default=datetime.datetime.now)
amount = models.FloatField(null=True)
price = models.FloatField(null=True, blank=True)
fee = models.FloatField(null=True, blank=True)
entry_type = models.CharField(max_length=5, choices=ENTRY_TYPE_CHOICES, default=ENTRY)
forms.py
class EntriesForm(ModelForm):
class Meta:
model = Entry
exclude = ()
widgets = {
'date': forms.DateTimeInput(attrs={'type':'datetime-local', 'class':'form-control'}),
}
EntriesFormSet = inlineformset_factory(Trade, Entry, form=EntriesForm, extra=1)
views.py
class TradeUpdateView(UpdateView):
model = Trade
form_class = CreateForm
success_url = reverse_lazy('trade-list')
def get_context_data(self, **kwargs):
data = super(TradeUpdateView, self).get_context_data(**kwargs)
if self.request.POST:
data['entries'] = EntriesFormSet(self.request.POST, instance=self.object)
else:
data['entries'] = EntriesFormSet(instance=self.object)
return data
def form_valid(self, form):
form.instance.user = self.request.user
form.instance.created_by = self.request.user
context = self.get_context_data()
entries = context['entries']
with transaction.atomic():
self.object = form.save()
if entries.is_valid():
entries.instance = self.object
entries.save()
return super(TradeUpdateView, self).form_valid(form)
trade_form.html
{% extends 'dashboard/base.html' %}
{% load static %}
{% block content %}
<script type="text/javascript" src="{% static 'vendor/jquery/jquery.js' %}"></script>
<script type="text/javascript" src="{% static 'admin/js/vendor/jquery/jquery.js' %}"></script>
<!-- Page Heading -->
<div class="d-sm-flex align-items-center justify-content-between mb-3">
<h2>New Trade</h2>
</div>
<div class="row">
<div class="col">
<form action="" method="post">{% csrf_token %}
{{ form.as_p }}
<table class="table">
{{ entries.management_form }}
{% for form in entries.forms %}
{% if forloop.first %}
<thead>
<tr>
{% for field in form.visible_fields %}
<th>{{ field.label|capfirst }}</th>
{% endfor %}
</tr>
</thead>
{% endif %}
<tr class="{% cycle row1 row2 %} formset_row">
{% for field in form.visible_fields %}
<td>
{# Include the hidden fields in the form #}
{% if forloop.first %}
{% for hidden in form.hidden_fields %}
{{ hidden }}
{% endfor %}
{% endif %}
{{ field.errors.as_ul }}
{{ field }}
</td>
{% endfor %}
</tr>
{% endfor %}
</table>
<input type="submit" value="Save"/> <a href="{% url 'trade-list' %}">back to the list</a>
</form>
</div>
</div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="{% static 'js/formset/jquery.formset.js' %}"></script>
<script type="text/javascript">
$('.formset_row').formset({
addText: 'add entry',
deleteText: 'remove',
prefix: 'entry_set'
});
</script>
{% endblock content %}
带有 type=datetime-local
的字段提交的格式似乎不是 Django 接受的格式,在我的本地测试中导致表单无法保存。有可能将字段的日期时间格式添加到 django 在设置文件中使用 DATETIME_INPUT_FORMATS
接受的格式(请参阅 https://docs.djangoproject.com/en/3.0/ref/settings/#std:setting-DATETIME_INPUT_FORMATS)。但是,如果您正在使用本地化(即在您的设置中使用 USE_L10N = True
),则 DATETIME_INPUT_FORMATS 似乎未被使用(根据我的测试 - 我没有查看底层代码)。在我花费的(诚然有限的)时间里,我无法让 DATETIME_INPUT_FORMATS 产生任何效果。
鉴于对 datetime-local
的支持非常有限,并且在任何情况下都难以让 django 接受结果,我建议您考虑使用日期时间小部件,它可以为您提供更多控制和更好的跨浏览器兼容性。 Flatpickr (https://flatpickr.js.org/).
在您的情况下,要使用 Flatpickr,您需要在相关 HTML 文件的顶部包含:
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css">
<script src="https://cdn.jsdelivr.net/npm/flatpickr"></script>
<script>
// This code activates flatpickr on fields with the 'datetimefield' class when the document has loaded
window.addEventListener("DOMContentLoaded", function () {
flatpickr(".datetimefield", {
enableTime: true,
enableSeconds: true,
dateFormat: "Y-m-d H:i:S",
});
});
</script>
并更改:
widgets = {
'date': forms.DateTimeInput(attrs={'type':'datetime-local', 'class':'form-control'}),
}
到
widgets = {
'date': forms.DateTimeInput(format='%Y-%m-%d %H:%M:%S', attrs={'class':'datetimefield'}),
}
这将导致 django 生成的字段具有同样为 flatpickr 配置的格式(基于上面字段中的文本,一个 django 接受)。
您可以使用许多其他日期选择器小部件,并且由于您已经在使用 jquery,因此具有 jquery 依赖项对您来说不一定是个大问题。
可能有点晚了,但我遇到了类似的问题,我使用的是模型表单,Django 在 html 表单中设置了无效的日期时间值(至少 Chrome)元素。看看你的是否也在做同样的事情 - 查看源代码。
解决方案是设置日期格式,以便在 html 元素的日期和时间部分之间插入一个 T:
widgets = {
# NOTE the form element needs "2021-01-01T12:00:00" BUT by default it's like: "2021-01-01 12:00:00"
'start_time': DateTimeInput(format='%Y-%m-%dT%H:%M:%S', attrs={'type': 'datetime-local'}),
'end_time': DateTimeInput(format='%Y-%m-%dT%H:%M:%S', attrs={'type': 'datetime-local'}),
}
顺便说一句,现在建议使用 datetime-local
而不是 datetime
(已弃用):mozilla page