如何在Django中获取JavaScript生成的日历日期值？

我用JavaScript渲染了动态日历，把选中的日期显示在<a>元素里，现在要在Django后端获取这个元素的日期值，但用request.POST.get('start', False)或者request.POST['start']始终返回False或None。想问有没有可行的解决办法，是不是必须换成Node.js做后端？

问题根源 #

<a>标签是页面展示元素，不属于表单控件范畴，表单提交时浏览器不会将它的内容作为表单数据发送给后端，这才导致Django接收不到对应值。完全不需要切换到Node.js，只要调整前端表单结构和JS逻辑就能解决。

解决方案 #

1. 添加隐藏输入框（最直接的修复） #

在表单中对应位置添加type="hidden"的输入框，专门用来存储日期值，表单提交时这些隐藏字段会自动被发送到后端：

修改HTML表单部分：

<div class="display-date">
    <p>Start date</p>
    <a id="start-date"></a>
    <!-- 新增隐藏输入框，用于传递日期值 -->
    <input type="hidden" name="start" id="start-hidden">
</div>
<div class="display-date">
    <p>End date</p>
    <a id="end-date"></a>
    <input type="hidden" name="end" id="end-hidden">
</div>

更新JavaScript代码，在修改<a>标签显示内容的同时，同步更新隐藏输入框的值：

const START_DATE = document.getElementById("start-date");
const END_DATE = document.getElementById("end-date");
// 新增隐藏输入框的DOM引用
const START_HIDDEN = document.getElementById("start-hidden");
const END_HIDDEN = document.getElementById("end-hidden");

current_date = new Date().toLocaleDateString("en-UK")
current = new Date();
next_day = new Date(current.getTime() + 86400000).toLocaleDateString("en-UK");

// 同时更新显示文本和隐藏字段的值
START_DATE.innerHTML = current_date;
START_HIDDEN.value = current_date;
END_DATE.innerHTML = next_day;
END_HIDDEN.value = next_day;

2. 完善日历的日期选择逻辑（补充核心交互） #

当前的JS还没实现点击日历日期的选择功能，需要添加点击事件来更新显示和隐藏字段，在render_calendar函数末尾添加以下代码：

// 为可点击的日期绑定点击事件
days_tag.querySelectorAll("li:not(.inactive)").forEach(day => {
    day.addEventListener("click", () => {
        // 构造选中的完整日期对象
        const selectedDate = new Date(current_year, current_month, parseInt(day.textContent));
        const formattedDate = selectedDate.toLocaleDateString("en-UK");
        
        // 示例逻辑：第一次点击设置开始日期，第二次点击设置结束日期
        if (!START_DATE.innerHTML) {
            START_DATE.innerHTML = formattedDate;
            START_HIDDEN.value = formattedDate;
        } else {
            // 可选：确保结束日期不早于开始日期
            const start = new Date(START_HIDDEN.value);
            if (selectedDate >= start) {
                END_DATE.innerHTML = formattedDate;
                END_HIDDEN.value = formattedDate;
            } else {
                alert("结束日期不能早于开始日期");
            }
        }
    });
});

Django后端获取数据 #

现在后端可以正常通过request.POST获取日期值了：

def booking_view(request):
    if request.method == 'POST':
        start_date = request.POST.get('start')
        end_date = request.POST.get('end')
        fullname = request.POST.get('fullname')
        email = request.POST.get('email')
        # 后续业务逻辑，例如保存到数据库、发送邮件等
        ...
    return render(request, 'booking.html')

内容的提问来源于stack exchange，提问作者Red