Date picker提交时返回undefined值的技术求助

我一眼就发现问题所在了！你之所以拿不到日期值，是因为选择器选错了元素，导致AJAX里的date变量根本没获取到输入框里的日期内容。

具体问题点 #

看你的HTML代码：

<label for="datepicker" class="astrick" id=datepicker>Date:</label>
<input type="text" class="form-control datepicker" data-toggle="datepicker">

你把id="datepicker"给了<label>标签，而日期输入框只有class="datepicker"，没有对应的id。当你在AJAX里写let date = $('#datepicker').val();时，选中的是那个<label>元素，而不是输入框——标签元素本身没有value属性，所以date变量是空值，自然传不到后端。

修复步骤 #

你有两种简单的修复方式，选一种就行：

方式1：给输入框添加id（推荐）

修改HTML里的输入框，加上id="datepicker"，同时移除label上的重复id（label的for属性会自动关联输入框的id，不影响点击label唤起日历的功能）：

<label for="datepicker" class="astrick">Date:</label>
<input type="text" id="datepicker" class="form-control datepicker" data-toggle="datepicker">

方式2：修改AJAX里的选择器

如果不想改动HTML，就把AJAX里获取日期的代码改成通过class选择器选中输入框：

let date = $('.datepicker').val();

⚠️ 注意：如果页面上有多个class为datepicker的元素，这种方式可能会拿到错误的值，所以更推荐方式1。

额外验证建议 #

修复后可以在AJAX代码里加一行调试输出，确认日期值是否正确获取：

console.log("获取到的日期：", date);

点击提交时查看控制台，就能确认日期值已经被正确拿到了。

修改完成后再测试，日期值应该就能正常传递到后端，不会再出现data:Failure的提示了！

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