django下bootstrap实现时间选择

1. 首先需要下载时间选择插件 https://www.bootcss.com/p/bootstrap-datetimepicker/

   下载解压后放入

然后首页模板中需要增加导入css和js的block

2.在非modelform的页面中引入css与js

设置输入框的id为：dt

#读取static目录
{% load static %}
#引入css
{% block css %}
    <link rel="stylesheet" href="{% static 'plugins/bootstrap-datetimepicker-master/css/bootstrap-datetimepicker.min.css' %}">
{% endblock %}

{% block content %}
    content中的代码
{% endblock %}


#引入js
{% block js %}
    <script src="{% static 'plugins/bootstrap-datetimepicker-master/js/bootstrap-datetimepicker.js' %}"></script>
    <script src="{% static 'plugins/bootstrap-datetimepicker-master/js/locales/bootstrap-datetimepicker.zh-CN.js' %}"></script>
    <script>
    #初始化插件
    $(function () {
        $('#dt').datetimepicker({
            #展现格式
            format: 'yyyy-mm-dd',
            #开始时间
            startDate: '0',
            #中文
            language: 'zh-CN',
            autoclose: 'true',
            #选择器所能够提供的最精确的时间选择视图，我这次只需要选择到天就好，所以填2
            #0表示分钟（默认），1表示小时，2表示天，3表示月，4表示年
            minView: 2
            #选择器打开之后首先展示的视图 (记录一下，本次没用到)
            #0表示分钟（默认），1表示小时，2表示天，3表示月，4表示年
            #startView: 4
        });
        })
    </script>
{% endblock %}

3.在modelform页面引入时间选择器 大体格式与上面是一样的，只是modelform无法自定义一个元素id， 但是model会给元素自动定义一个id

初始化插件时的id就可以填写：id_model中的字段名