我创建了一个代码来禁用从数据库中检索的某些日期。
在 getDates 脚本中,我只是从数据库中检索日期,返回它们并将它们分配给数组 unavailableDates。
<script>
var unavailableDates;
function unavailable(date) {
dmy = date.getDate() + "-" + (date.getMonth() + 1) + "-" + date.getFullYear();
if ($.inArray(dmy, unavailableDates) == -1) {
return [true, ""];
} else {
return [false, "", "Unavailable"];
}
}
$(document).ready(function()
{
$("#datepicker").datepicker({
dateFormat: 'yy-mm-dd',
beforeShowDay: unavailable,
minDate: 0,
firstDay: 1, // rows starts on Monday
changeMonth: true,
changeYear: true,
showOtherMonths: true,
selectOtherMonths: true,
altField: '#date_due',
altFormat: 'yy-mm-dd'
});
$('#datepicker').focus(function(){
//alert($('#name').html());
$.ajax({
url: 'getDates.php',
data: "artist_id="+$('#name').html(),
dataType: 'json',
success: function(data)
{
unavailableDates = data;
}
});
})
});
</script>
它工作正常,但只有当我在 datepicker 中单击两次时。当我第一次单击时,它会显示所有日期(无论它们是否可用)。当我再次点击时,它会显示不可用的日期。
有人知道为什么吗?谢谢
最佳答案
将 async: false 添加到您的 ajax 调用中,这样应用程序将在继续之前等待响应,就像这样
$('#datepicker').focus(function(){
//alert($('#name').html());
$.ajax({
url: 'getDates.php',
data: "artist_id="+$('#name').html(),
dataType: 'json',
async: false,
success: function(data)
{
unavailableDates = data;
}
});
另一个想法,您可以将此 ajax 调用直接添加到不可用函数中,而不是先运行两个东西,onFocus 和 beforeShowDay(尽管我对 beforeShowDay 函数不是很熟悉)
但这可能会减慢日期选择器的打开速度,因为它必须等待服务,因此这取决于您的服务速度和您的性能要求。如果这可能会变慢,其他选项是弹出“获取日期”消息或在页面向上时每隔 X 秒拉一次服务器(尽管这可能会增加很多额外的服务调用......)
编辑:在此评论之后...
"basically when user selects an option (here they want to book artists so \
when user selects an artist), the unavailable dates of datepicker are
updated automatically."
似乎在选择艺术家时加载列表会更有意义,除非您担心页面打开时会发生变化。在那种情况下,我会做类似...
On Artist Changed
-Disable date picker, possibly add a small note next to it / under it /
over it that it is loading
-Start ajax call with async true
-In ajax success function, re-enable the picker and remove the message.
这将允许 UI 保持事件状态,允许用户在加载日期时输入其他信息,如果服务足够快,用户甚至都不会知道它被禁用了一秒钟。你的约会不会像其他方式那样“现场”,但听起来他们不需要那么现场。无论如何,您都需要在提交表单时重新检查日期。
关于php - datePicker 需要点击两次才能显示不可用的日期,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18155664/