Kendo UI DatePicker表单POST提交值无法传递至JSP的问题

你的问题核心在于被设置为disabled的表单元素不会随POST请求提交数据，这是HTML的原生规则——浏览器会自动忽略禁用状态的表单控件，所以后端用request.getParameter("dateReq")自然拿不到值，返回null。

最优解决方案：用readonly替代disabled #

readonly属性既能阻止用户手动输入（满足你强制使用日历选择的需求），又会保留表单值并随请求提交。你只需要修改两处代码：

1. 修改JS中的禁用逻辑：
   把原来的$("#dateReq").attr("disabled","disabled");替换为：

   $("#dateReq").attr("readonly", "readonly");
   

2. 增强Kendo DatePicker的配置：
   在DatePicker的初始化配置中添加editable: false，彻底禁止键盘输入操作，确保用户只能通过日历选择日期：

   $('#dateReq').kendoDatePicker({
       value: presentDate,
       min: presentDate,
       disableDates: ["mo", "tu", "we", "th", "fr", "sa"],
       editable: false, // 禁止键盘编辑，仅允许日历选择
       change: function() {
           var value = this.value();
           $("#dateReq").attr("value", kendo.toString(new Date(value), "d"));
       }
   }).data('kendoDatePicker');
   

备选方案：使用隐藏字段（如果必须保留disabled） #

如果你因为某些原因一定要用disabled，可以添加一个隐藏的<input>元素，将DatePicker的值同步到这个隐藏字段中，后端从隐藏字段获取值：

1. 在HTML中添加隐藏字段：

   <td>Date Req 
       <input type="text" name="dateReq_display" id="dateReq" size="10" value=""/>
       <input type="hidden" name="dateReq" id="hiddenDateReq"/>
       <BR>(mm/dd/yyyy)
   </td>
   

2. 修改DatePicker的change事件：

   change: function() {
       var value = this.value();
       var formattedDate = kendo.toString(new Date(value), "d");
       $("#dateReq").attr("value", formattedDate);
       $("#hiddenDateReq").val(formattedDate); // 同步值到隐藏字段
   }
   

3. 后端取值：
   依旧使用request.getParameter("dateReq")，此时获取的是隐藏字段的值。

为什么disabled不行？ #

根据HTML规范，当表单元素被设置为disabled时：

• 用户无法与该元素交互
• 该元素的值不会被包含在表单提交的数据中
• 浏览器不会将其作为请求参数发送到服务器

而readonly属性只是禁止用户修改元素值，但元素会正常参与表单提交，完美匹配你的需求场景。

内容的提问来源于stack exchange，提问作者O. Abrahim