我有一个日期选择器,它禁用了商店关闭时的日期。用户仍然可以键入此字段,并且日期选择器不会对选择器中禁用的日期进行验证。它实际上甚至不尊重最大/最小日期......我将如何做到这一点?
$("#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 :(得分: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: ...
});
});