You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何为Django表单中的DateRangeField配置日历选择部件?

解决Django DateRangeField表单日历选择问题

你需要使用Django自带的DateRangeWidget部件,同时给输入框设置type="date"属性来触发浏览器原生的日历选择器。修改后的表单代码如下:

forms.py

from django import forms
from django.forms.widgets import DateRangeWidget
from .models import CommissionElection

class CreateCommissionElection(forms.ModelForm):
    class Meta:
        model = CommissionElection
        fields = ['electable_time',]
        widgets = {
            'electable_time': DateRangeWidget(attrs={
                'type': 'date'
            })
        }

说明:

  • DateRangeWidget是Django专为DateRangeField设计的部件,会自动生成两个日期输入框,分别对应范围的起始和结束日期。
  • 通过attrs={'type': 'date'}设置输入框类型为日期,浏览器会自动渲染出可点击选择的日历控件,无需额外前端代码。
  • 如果需要更定制化的日期范围选择器,比如联动选择、样式美化,可以结合前端日期插件(如Flatpickr、daterangepicker),但原生方案已经能满足基础需求。

内容的提问来源于stack exchange,提问作者Annelotte

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.22 23:28:10