2011-08-10 4 views
0

나는 상점 폐쇄시 날짜가 비활성화 된 datepicker를 보유하고 있습니다. 사용자는이 필드에 계속 입력 할 수 있으며 선택기에서 비활성화 된 날짜에 대한 datepicker의 유효성을 검사하지 않습니다. 실제로 최대/최소 날짜도 존중하지 않습니다 ... 어떻게이 일을 수행할까요?비활성화 일에 대해 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: ... 
    }); 
}); 
관련 문제