用于 DataTypeCheck 的 jQuery UI datetimepicker 和 ASP.NET CompareValidator答案

【问题标题】：jQuery UI datetimepicker and ASP.NET CompareValidator for DataTypeCheck用于 DataTypeCheck 的 jQuery UI datetimepicker 和 ASP.NET CompareValidator
【发布时间】：2010-12-09 02:28:39
【问题描述】：

我正在使用带有 jQuery UI 日期选择器的 ASP.NET 文本框。文本框允许编辑，以便用户可以手动输入日期或清除现有条目。我添加了一个 CompareValidator 来对文本框执行数据类型检查，这在使用 datepicker 选择日期后会导致错误。错误发生在 ASP.NET 客户端验证中：

Microsoft JScript runtime error: 'length' is null or not an object

错误发生在 ValidatorOnChange 中。我怎样才能解决这个问题？是否可以将 datepicker 与 ASP.NET 验证器控件一起使用？

我的标记是：

<asp:Label runat="server" AssociatedControlID="uxInstallDate">Install Date</asp:Label>
<asp:TextBox ID="uxInstallDate" runat="server" Columns="10" />
<asp:CompareValidator runat="server" ControlToValidate="uxInstallDate" Operator="DataTypeCheck" Type="Date" Text="*" ErrorMessage="Install Date must be a date." Display="Dynamic" />

请注意，CompareValidator 中缺少的 ID 属性是故意的，添加它不会产生任何影响。我的 jQuery 初始化是：

$(document).ready(function() {
    $("#<%= uxInstallDate.ClientID %>").datepicker({ changeMonth: true });
});

【问题讨论】：

标签： asp.net jquery jquery-ui validation

【解决方案1】：

我想我找到了解决办法。这是 IE 中出现的错误，而不是 Firefox（我没有测试任何其他浏览器）。解决方法是在初始化时重写 onSelect 方法：

$("#<%= uxInstallDate.ClientID %>").datepicker({ changeMonth: true, onSelect: function() { } });

我找到了问题的描述和解决方案here 和替代解决方案here。

【讨论】：

【解决方案2】：

基于 Jamie 的解决方案和他提供的the alternate 解决方案，这是我绕过这个仅在 IE 中出现的奇怪错误的解决方法。

我认为 datepicker 控件选择的日期是有效日期，所以如果它是可见的，我会隐藏 CompareValidator 的消息或图像错误。

$(".myControl").datepicker({
    onSelect: function() {
        if ($.browser.msie) {
            if ($(this).next("span").css("display") != "none") {
                $(this).next("span").css("display", "none");
            }
        }
        else {
            $(this).trigger('change');
        }
    }
 });

希望有所帮助

【讨论】：