JQuery Datepicker 函数总是返回一个空值作为日期答案

【问题标题】：JQuery Datepicker function always returns a null value for the dateJQuery Datepicker 函数总是返回一个空值作为日期
【发布时间】：2014-03-09 21:01:02
【问题描述】：

我最近一直在做一些让我难过的事情。

我正在使用带有内置验证功能的 Spring 3.0 以及 Hibernate 3.6。

我正在尝试使用JQuery datepicker 输入用户的日期。但是，发送到我的控制器的日期始终为空，并且对我的 Spring Validation 造成了严重破坏。

我总是收到这个错误

    javax.validation.ConstraintViolationException: Validation failed for classes       [dao.Appointments] during persist time for groups [javax.validation.groups.Default, ]
List of constraint violations:[
    ConstraintViolationImpl{interpolatedMessage='may not be null', propertyPath=appointment_date, rootBeanClass=class dao.Appointments, messageTemplate='{javax.validation.constraints.NotNull.message}'}
]

我发现这个错误正在发生，因为发送到我的控制器的日期是“null”，所以我回去查看我的 JSP 中的日期值

<meta charset="utf-8">
        <link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
        <script src="//code.jquery.com/jquery-1.9.1.js"></script>
        <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
        <link rel="stylesheet" href="/resources/demos/style.css">


        <script type="text/javascript">
            jQuery(document).ready(function() {
                jQuery('#datepicker').datepicker({
                dateFormat : 'yy-mm-dd'
                });
            });
        </script>

            <!-- <script>
                $(function() {
                $( "#datepicker" ).datepicker();
                });
            </script> -->


            <script>
            function validateForm()
            {
                var x=document.forms["makeAppointmentForm"]["datepicker"].value;
                if (x==null || x=="")
                {
                    alert("Date must be selected");
                    return false;
                }

                var y=document.forms["makeAppointmentForm"]["desDoctor"].value;
                if (y==null || y=="")
                {
                    alert("Your desired doctor must be filled in");
                    return false;
                }   
            }   
            </script>

上面的代码是我在我的 JSP 中的代码，我尝试了几个版本的日期选择器，但我的日期仍然得到一个“空”值。我对我的字段使用了 Javascript 验证。

<form name ="makeAppointmentForm" action="makeAppointment" method="post"     onsubmit="return validateForm()">
<font>When selecting the date, Please click in the date field and a drop down menu will appear so that you may click on the date. 
The system will do the rest!!!</font><br>

Please select your desired date of appointment: <input type="text" id="datepicker" class="text"/><br><br>

上面的代码是我使用日期选择器让用户输入他们想要的日期的地方。我将 println 语句放在我的代码中，以尝试查看日期在哪里出现为空，到目前为止，它从一开始就是“空”。我已经尝试过我在 stackoverflow 上找到的 JQuery datepicker 的其他公式，但它总是出现同样的问题。

任何帮助将不胜感激。

【问题讨论】：

标签： jquery html forms spring datepicker

【解决方案1】：

我认为您混淆了input 标签的name 和id 属性。 document.forms 使用 name 属性，而不是 id。

如果您不将name="datepicker" 添加到输入标签，document.forms["makeAppointmentForm"]["datepicker"].value 将始终为空。

Spring 也一样，它使用 name 属性将输入值映射到请求参数。

添加名称属性应该可以解决您的问题：

<input type="text" id="datepicker" name="datepicker" class="text"/>

【讨论】：

哦！！感谢 Jean-Philippe，修复了它！