jQuery UI 日历，使用 PHP 从数据库中提取数据

Question

我想从具有选择日期的数据库（我使用 Laravel 作为框架）中提取数据，然后在前端日历上向用户显示这些日期不可用并将它们屏蔽掉，这样他们就不能选择它们。

我的数据库结构是：

我有来自 jQueryUI 网站的标准代码：

<link rel="stylesheet" href="/css/redmond/jquery-ui-1.10.4.custom.css">
<script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<script>
    $(function() {
        $( "#from" ).datepicker({
            defaultDate: "+1w",
            changeMonth: true,
            numberOfMonths: 2,
            onClose: function( selectedDate ) {
                $( "#to" ).datepicker( "option", "minDate", selectedDate );
            }
        });
        $( "#to" ).datepicker({
            defaultDate: "+1w",
            changeMonth: true,
            numberOfMonths: 2,
            onClose: function( selectedDate ) {
                $( "#from" ).datepicker( "option", "maxDate", selectedDate );
            }
        });
    });
</script>

那么我如何将我的数据放入日历中以仅显示可用日期。我正在尝试制作一个简单的预订日历。

提前致谢。

Answer 1

• 查询数据库并获取日期数组：

var dates = ["2013-03-14","2013-03-15","2013-03-16"]

• 禁用日期

使用beforeShowDay，类似这样：

beforeShowDay: function(date) {
    var d = $.datepicker.formatDate('yy-mm-dd', date);
    return [ dates.indexOf(d) == -1 ]
}