0

jquery datepicker にマスキングを追加し、検証を追加しました。

ここにjsfiddleとコードがあります

<input class="datepicker" type="text" />
<br /><br />
<input type="button" style="width:50px;" />

$( ".datepicker" ).datepicker({ dateFormat: 'dd-M-yy'});
$(".datepicker").mask("99-aaa-9999");

$(".datepicker").blur(function(){
var date1 = $(this).val(); 

    var validate = IsValidDate(date1);
    if(!validate ){
        alert("Invalid Date formart, Required Date Format : dd-mmm-yyyy");
    $(this).val("");
}
   });

function IsValidDate(myDate) {
                var filter = /^([012]?\d|3[01])-([Jj][Aa][Nn]|[Ff][Ee][bB]|[Mm][Aa][Rr]|[Aa][Pp][Rr]|[Mm][Aa][Yy]|[Jj][Uu][Nn]|[Jj][u]l|[aA][Uu][gG]|[Ss][eE][pP]|[oO][Cc]|[Nn][oO][Vv]|[Dd][Ee][Cc])-(19|20)\d\d$/
                                return filter.test(myDate);
            }

今、私は問題に直面しています。ユーザーがカレンダーから日付を選択しようとすると、検証が開始されますが、これは発生すべきではありません。

誰かが私のコードで何が間違っているかを提案できますか? ありがとう ：）

問題を解決することはできましたが、それが最も効率的な方法かどうかはわかりません

ここに更新されたコードとリンクがあります

http://jsfiddle.net/smdvA/191/

$( ".datepicker" ).datepicker({ dateFormat: 'dd-M-yy'});
$(".datepicker").mask("99-aaa-9999");

$(".datepicker").blur(function(){
    var date1 = $(this).val(); 
    if(date1 != ""){
    var validate = IsValidDate(date1);
    if(!validate ){
        alert("Invalid Date formart, Date Format : dd-MMM-yyyy");
        $(this).val("");}}
});

function IsValidDate(myDate) {
                var filter = /^([012]?\d|3[01])-([Jj][Aa][Nn]|[Ff][Ee][bB]|[Mm][Aa][Rr]|[Aa][Pp][Rr]|[Mm][Aa][Yy]|[Jj][Uu][Nn]|[Jj][u]l|[aA][Uu][gG]|[Ss][eE][pP]|[oO][Cc]|[Nn][oO][Vv]|[Dd][Ee][Cc])-(19|20)\d\d$/
                                return filter.test(myDate);
            }
4

1 に答える 1

1

「blur」よりも優先される方法として、datepicker の「onselect」を使用します。

$( ".datepicker" ).datepicker({ dateFormat: 'dd-M-yy', onSelect: function(date) { 
        var validate = IsValidDate(date);

        if(!validate)
        {
            alert("Invalid Date formart, Date Format : dd-MMM-yyyy");
            $(this).val("");
        }
}});
于 2012-11-25T11:19:57.373 に答える