模板中的 django 日期选择器输入
django date picker input in template
我正在尝试使用模板中模型表单中的日期选择器小部件。我看过几个帖子,但无法正常工作。
我现在尝试的是:Answered question
Form.py
我的表单代码看起来像
class FormularioTareas(forms.ModelForm):
class Meta:
model = Tareas
widgets = {'fecha_limite': forms.DateInput(attrs={'class': 'datepicker'})}
fields = ["destinatario", "titulo", "tarea", "resuelto", "fecha_limite"]
模板
在模板中我添加了这个脚本:
/* Include the jquery Ui here */
<script>
$(function() {
$( ".datepicker" ).datepicker({
changeMonth: true,
changeYear: true,
yearRange: "1900:2012",
});
});
</script>
并在 html
中调用此表单
<div style="background: white;">{{ tareas_form.fecha_limite }}</div>
Jquery
我按如下方式加载 Jquery,在浏览器控制台中未检测到任何问题。
<script src="{% static 'js/jquery-3.2.1.min.js' %}"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
我得到的
我发现选择器可以正常工作,但主文本框在聚焦时会显示选项,所以我没有看到它。文本框仍然充当日期选择器和文本框。我怎样才能防止这种情况发生?
欢迎提供任何线索。谢谢!
我在表单上使用了自动完成="off",所以通常的文本输入下拉选项不会显示。
我正在尝试使用模板中模型表单中的日期选择器小部件。我看过几个帖子,但无法正常工作。
我现在尝试的是:Answered question
Form.py
我的表单代码看起来像
class FormularioTareas(forms.ModelForm):
class Meta:
model = Tareas
widgets = {'fecha_limite': forms.DateInput(attrs={'class': 'datepicker'})}
fields = ["destinatario", "titulo", "tarea", "resuelto", "fecha_limite"]
模板
在模板中我添加了这个脚本:
/* Include the jquery Ui here */
<script>
$(function() {
$( ".datepicker" ).datepicker({
changeMonth: true,
changeYear: true,
yearRange: "1900:2012",
});
});
</script>
并在 html
中调用此表单<div style="background: white;">{{ tareas_form.fecha_limite }}</div>
Jquery
我按如下方式加载 Jquery,在浏览器控制台中未检测到任何问题。
<script src="{% static 'js/jquery-3.2.1.min.js' %}"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
我得到的
我发现选择器可以正常工作,但主文本框在聚焦时会显示选项,所以我没有看到它。文本框仍然充当日期选择器和文本框。我怎样才能防止这种情况发生?
欢迎提供任何线索。谢谢!
我在表单上使用了自动完成="off",所以通常的文本输入下拉选项不会显示。