0

我将 jQuery-ui datepicker与 Jörn Zaefferer 的validate插件一起使用。

众所周知，验证不会在日期选择器更改输入字段的内容后自动触发。

我觉得好奇的是，当点击年份下拉菜单、点击月份下拉菜单和点击日期时，验证确实会触发。而且，在这些情况下，输入字段的值都没有改变。您可以在这里自己尝试：http: //jsfiddle.net/ECku3/12/有 console.log 事件显示何时调用验证方法以及何时$.validator.showErrors()调用验证字段的值。

tl;博士

我想找到一种在日期选择器有焦点时防止验证的方法。但是当用户键入日期而不是使用日期选择器时，我不想阻止验证。所以我不能只是设置$.validator.settings.onfocusout = false。

想法？

4

1 回答 1

1

我已经像这样使用了jquery.ui.datepicker.validation.js插件：

$(document).ready(function() {
    $.datepicker.setDefaults({
        dateFormat: 'yy-mm-dd',
        firstDay: 1,
        showOn: 'button',
        changeMonth: true,
        changeYear: true,

    });

    $("#mydate").datepicker();
    $('#myform').validate({ 
        errorPlacement: $.datepicker.errorPlacement, 
        rules: { 
            mydate: { 
                required: true, 
                dpDate: function(){traceBack(); return true;},
                dpCompareDate: 'notBefore 2011-01-01' 
            } 
        }, 
        messages: { 
            mydate: 'Please enter a valid date (yyyy-mm-dd) after 2011-01-01'
        }});

    function traceBack() {
        console.log("Firing?");
    }
});​

编辑

如果您真的不希望在 datepicker 小部件中导航时触发任何验证事件，您可以在 datepicker 小部件可见时关闭 onfocusout 设置：

$(document).ready(function() {
    $.datepicker.setDefaults({
        dateFormat: 'yy-mm-dd',
        firstDay: 1,
        showOn: 'button',
        changeMonth: true,
        changeYear: true,
        beforeShow: function () {$("#myform").validate().settings.onfocusout = false; },
        onClose: function () {$("#myform").validate().settings.onfocusout = true;}
    });

    $("#mydate").datepicker();
    $('#myform').validate({ 
        errorPlacement: $.datepicker.errorPlacement, 
        rules: { 
            mydate: { 
                required: true, 
                dpDate: function(){traceBack(); return true;},
                dpCompareDate: 'notBefore 2011-01-01' 
            } 
        }, 
        messages: { 
            mydate: 'Please enter a valid date (yyyy-mm-dd) after 2011-01-01'
        }});

    function traceBack() {
        console.log("Firing?");
    }

});​

看到这个小提琴：http: //jsfiddle.net/mccannf/Bn7gy/24/

于 2012-11-02T16:41:27.010 回答