2011-08-10 30 views
0

私は店が閉じられたときの日付を無効にしたdatepickerを持っています。ユーザーは引き続きこのフィールドに入力することができ、ピッカーで無効になっている日付に対してdatepickerが検証していません。実際にはmax/minの日付も尊敬していません...どうすればこのことをやりますか?無効日に対するjquery datepickerの日付を確認します

$("#date").datepicker({ 
    beforeShowDay : function(date) { 
     var day = date.getDay(); 
     return [(day != 0)]; 
    }, 
    minDate : '08/10/2011', 
    onClose: function(dateText, inst) { 
     try { 
      $.datepicker.parseDate('dd/mm/yy', dateText); 
     } catch (e) { 
      $(this).datepicker("setDate", ''); 
     }; 
    } 
}); 

編集:

私は、テキスト入力のための私自身の検証をロールアップしました。以下を参照してください:

var today = '08/10/2011'; 

$("#date").datepicker({ 
    beforeShowDay : function(date) { 
     var day = date.getDay(); 
     return [(day != 0 && day != 1 && day != 6)]; 
    }, 
    minDate : today, 
    onClose : function(dateText) 
    { 
     if(dateText) 
      try { 
       var date = $.datepicker.parseDate('mm/dd/yy', dateText); 
       var day = new Date($(this).val()).getDay(); 
       if(day == 0 || day == 1 || day == 6) 
       { 
        alert('Sorry, the clinic is closed on ' + dateText); 
        $(this).datepicker("setDate", ''); 
       } 
       if(date.getTime() - new Date(today).getTime() < 0) 
       { 
        alert('Please select a future date: ex. (' + today + ')'); 
        $(this).datepicker("setDate", ''); 
       } 
      } catch (e) { 
       alert('Please provide a valid date: ex. (' + today + ')'); 
       $(this).datepicker("setDate", ''); 
      }; 
    } 
}); 

答えて

0

問題は、jQueryの制限が日付セレクタポップアップに適用されますが、関連付けられているテキスト入力には適用されないということです。だから、jQueryの検証フレームワークのようなものを使って独自の検証を行うこともできますし、単純な解決策として、テキストボックスを無効にして、セレクタを使って日付だけを提供することもできます。

<div> 
    <p>Date: <input type="text" id="date" disabled="disabled"/></p> 
</div> 

$(function() { 
    $("#date").datepicker({    
     showOn: "button", 
     buttonImage: "http://jqueryui.com/demos/datepicker/images/calendar.gif", 
     buttonImageOnly: true, 
     minDate: ..., 
     maxDate: ... 
    }); 
}); 
関連する問題