Python 如何将日期选择器添加到Django ModelFrom中？_Python_Django_Datepicker_Django Templates

Python 如何将日期选择器添加到Django ModelFrom中？

python django

Python 如何将日期选择器添加到Django ModelFrom中？,python,django,datepicker,django-templates,Python,Django,Datepicker,Django Templates,这些是我的剧本- models.py from django.db import models class Leave(models.Model): ... from_date = models.DateField() to_date = models.DateField() def __str__(self): return self.name 我想为上面的日期字段（s）设置日期选择器这是我的表单模板：- {% extends "base

这些是我的剧本-

models.py

from django.db import models

class Leave(models.Model):
    ...
    from_date = models.DateField()
    to_date = models.DateField()

    def __str__(self):
        return self.name

我想为上面的

日期字段

（s）设置日期选择器

这是我的表单模板：-

{% extends "base.html" %}

{% block content %}

<div class="container">
    <h3>  Fill out the form please! </h3>
    <h4>
        <form action="." role="form", method="POST">
            {% csrf_token %}

            {{ form.as_p }}

            <button type = "submit">Submit</button>
        </form>
    </h4>
</div>
{% endblock %}

在使用ModelForms时，我在我的forms.py中包含了以下代码-

class LeaveRequestForm(ModelForm): 
    class Meta:
        fields = ("from_date", "to_date")
        model = Leave

        widgets =  {

            'from_date' : DateInput(attrs={'class': 'datepicker'}),
            'to_date' : DateInput(attrs={'class': 'datepicker'}),

        }

但我的html模板中没有反映日期选择器。我读过很多其他与此相关的问题，但不明白。希望，有人能详细解释我

base.html

...
<html>
  <head>
    ...

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
    <!-- Latest compiled and minified CSS -->

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

    <!-- Optional theme -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">

    <!-- Latest compiled and minified JavaScript -->
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

    ...

  </head>

。。。
...
...

我认为你的代码是正确的。但是，从您的评论来看，您似乎正在使用引导。您需要在bootstrap.min.js之前而不是之后导入Jquery。如果页面中存在javascript错误，则会阻止日期选择器工作。
在
attrs
中，您正在为两个不同的日期元素传递相同的
id
，
from_date
和
to_date
。我将删除显式的
id
定义，Django将自动将
id\u from\u date
和
id\u to\u date
分配给字段。然后打开浏览器的开发工具，在控制台中查找JavaScript错误。@FlipperPA但什么也没发生<代码>未捕获错误：Bootstrap的JavaScript需要Bootstrap.min.js:6中的jQuery
... <html> <head> ... <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> ... </head>