jQuery UI Datepicker希望只启用特定的日期

Question

我有一个注册模型和表单，它使用一个日期选择器。我希望用户只能选择与事件(另一个模型)对应的日期。

我的问题是我找不到正确的方法来传递事件数组给javascript。

这是在控制器:

@available_dates = Event.pluck(:start_time).as_json

这是在视图:

    <script>
       var availableDates = [<%= @available_dates.to_s.html_safe %>] ;
    </script>

，这是js:

function available(date) {
    ymd = date.getFullYear() + "-" + ('0' + (date.getMonth()+1)).slice(-2) + "-" + ('0' + date.getDate()).slice(-2);
    console.log(ymd+' : '+($.inArray(ymd, availableDates)));
    if ($.inArray(ymd, availableDates) != -1) {
        return [true, "","Available"];
    } else {
        return [false,"","unAvailable"];
    }
}
$("#registration_date").datepicker({ beforeShowDay: available, dateFormat: "yy-mm-dd"});

我认为我在视图中做错了什么，因为js数组似乎是空的看着控制台…

如有任何帮助，不胜感激

Answer 1

在您提到的问题评论中，@available_dates.to_s返回"["2013-01-05", "2013-02-02", "2013-03-02"]"。它本身会在页面上渲染数组，所以不需要再次"框起来"。

尝试更改以下行:

var availableDates = [<%= @available_dates.to_s.html_safe %>] ;

:

var availableDates = <%= @available_dates.to_s.html_safe %>;

希望有帮助。

如果没有，您要么在代码中进一步清除@available_dates的值，要么在视图的上下文中不可用@available_dates。您是否尝试过使用debugger;逐步执行代码?