Question

我有以下两个datetimepicker函数/字段：

    $(function() 
    {
        $('#updateJobForm').validate();
        var startDateTime = $('#startTime');
        var endDateTime = $('#endTime');
        var currentDate = new Date();
        var orginalDate =  startDateTime.val();

        startDateTime.datetimepicker(
            {
                timeFormat: "hh:mm tt",
                minDate: ("setDate", '',new Date()),
                hourGrid: 12,
                minuteGrid: 15,
                stepMinute: 15,
                onClose: function(dateText, inst) 
                {
                    if (endDateTime.val() != '') 
                    {
                        var testStartTime = startDateTime.datetimepicker('getDate');
                        var testEndTime = endDateTime.datetimepicker('getDate');
                        if (testStartTime > testEndTime)
                        {
                            alert("The start time cannot be greater than the end time.");
                            //startDateTime.val(currentDate.format("m/d/yyyy hh:mm tt"));
                        }
                    }
                    else 
                    {
                        endDateTime.val(dateText);
                    }
                },
                onSelect: function (selectedDateTime)
                    {
                        var testStartTime = startDateTime.datetimepicker('getDate');
                        var testEndTime = endDateTime.datetimepicker('getDate');
                        //if(endDateTime.val() == '')
                        //{
                            endDateTime.datetimepicker('option', 'minDate', startDateTime.datetimepicker('getDate'));
                    }
                }
            );
            endDateTime.datetimepicker(
                {
                    minDate: ("setDate", '',new Date()),
                    timeFormat: "hh:mm tt",
                    hourGrid: 12,
                    minuteGrid: 15,
                    stepMinute: 15,
                    onClose: function(dateText, inst) 
                    {
                        if (startDateTime.val() != '') 
                        {
                            //var testStartTime = startDateTime.datetimepicker('getDate');
                            var testEndTime =  endDateTime.datetimepicker('getDate');
                            //if (testEndTime < testStartTime)
                            //{
                            //alert("The end date blah blah"); // and time must be greater than the start date and time");
                            //endDateTime.val(testStartTime.format("mm/dd/yyyy hh:MM"));
                            //}
                            //else
                            endDateTime.datetimepicker('setDate', testEndTime);
                        }
                        //else 
                        {
                        //  startDateTime.val(dateText);
                        }
                    },
                    onSelect: function (selectedDateTime)
                    {
                    startDateTime.datetimepicker('option', 'maxDate', endDateTime.datetimepicker('getDate') );
                    }
                }
            );
        }
    );
    function validate_form()
    {
        var sDate= new Date(document.updateJobForm.startTime.value);
        var eDate= new Date(document.updateJobForm.endTime.value);
        if ((document. updateJobForm.startTime.value != "") && (document. updateJobForm.endTime.value != "") && (sDate < eDate))

        {
            return true;
        }

        else

        {
            alert("Please choose a start date/time that begins before the end date/time");
            return false;
        }
    }

从我的提交按钮调用的validate_form函数如下所示：

<td align="right"><input name="reset" type="reset" value="Reset" />
<input name="submit" type="submit" value="Update" onclick="validate_form()"/></td>
<td>&nbsp;</td>

当我点击提交按钮（包含错误的数据，即开始日期比结束日期更重要）时，我收到警告消息，告诉用户更正时间。在用户单击“确定”警报后，表单将提交无效数据。该函数看起来正确，逻辑似乎有效，但为什么在函数返回false后提交表单？更糟糕的是，如果数据正确，表单根本不会提交。出了什么问题，我该如何解决这个问题？

Answer 1

您错过了按钮返回

onclick="return validate_form()"

Answer 2

您的验证功能应放在表单本身的“onSubmit”事件上，而不是放在提交按钮的“onClick”事件上！这就是返回值阻止表单提交的地方！

为什么javascript传递未经验证的信息

2 个答案: