Question

我需要帮助了解我实际上哪里出错了。

所以我正在使用jQueryUI的datepicker，http://jqueryui.com/datepicker/。

我使用了本教程的一部分：http://www.phpeveryday.com/articles/jQuery-UI-AJAX-JSON-Datepicker-P1029.html

我正在使用AJAX查询数据库，因此它只允许来自数据库的日期。下面是返回的JSON：

{"COLUMNS":["APPOINTMENT_DATE"],"DATA":[["July, 29 2013 00:00:00"]]}

以下是我的整个JavaScript：

$(document).ready(function () {

var months = [], days = [];

$.ajax({
    type: 'get',  
    url: 'cfc/datepicker.cfc?ReturnFormat=json',  
    data: {
        method: 'getDates',
        todayDate: '07-29-2013'
        },
    contentType: 'json',
    dataType: 'json',
    success: function(response) {
        for (x = 0; x < response.DATA.length; x++) {
            months.push(response.DATA[x].month);
            days.push(response.DATA[x].day);
        }
    }
}); 

function addDates(date){
    //Weekends are NOT selectable
    if (date.getDay() == 0 || date.getDay() == 6) {
        return [false, ""];
    }

    //Using AJAX call above, all RETURNED dates are selectable
    for (x = 0; x < days.length; x++) {
        if (date.getMonth() == months[x] - 1 &&
            date.getDate() == days[x]) {
            return [true, ""];
        }
    }

    //If dates are not from above, they are NOT selectable
    return [false, ""];
}

var DP_options = {
    beforeShowDay: addDates
//      minDate: "+1"
};

$("#dateInput").datepicker(DP_options);
});

我理解addDates函数下的所有内容。我遇到的问题是AJAX调用。我可以得到回复，这是成功的功能，我很难过。它应该使用JSON响应并将这些变量推送到顶部的months和days变量，addDates函数将使用这些变量来启用它们。

如何将JSON响应中的信息推送到months和days变量？或者我错过了一步？

Answer 1

根据Adam的建议，我拆开了JSON响应。我做的一个重要错误是不查看教程并看到JSON响应需要单独的 MONTH 和 DAY 列。我只是假设一个DATE字符串能够分开来分隔MONTH和DAY变量。猜不是。

这是返回的JSON：

{"COLUMNS":["APPOINTMENT_DATE"],"DATA":[["August, 06 2013 00:00:00"]]}

作为参考，下面是我正在使用的JavaScript，它返回只允许从数据库返回的日期可供选择。

$(document).ready(function () {

var months = []; 
var days = [];

$.ajax({
    type: 'get',  
    url: 'cfc/datepicker.cfc?ReturnFormat=json',  
    data: {
        method: 'getDates'
        },
    contentType: 'json',
    dataType: 'json',
    success: function(response) {
        for(var x = 0; x < response.DATA.length; x++) {
            var monthName = {
                January: 1,
                February: 2,
                March: 3,
                April: 4,
                May: 5,
                June: 6,
                July: 7,
                August: 8,
                September: 9,
                October: 10,
                November: 11,
                December: 12
            }
            //Expected Response: {"COLUMNS":["APPOINTMENT_DATE"],"DATA":[["August, 06 2013 00:00:00"]]}
            var thisResponse = response.DATA[x]; //"August, 06 2013 00:00:00"
            var stringResponse = String(thisResponse); //Above is an Object, convert to String
            var thisMonth = String(stringResponse.split(",")[0]); //August
            var thisMonth_Num = String(monthName[thisMonth]); //Use monthName key above
            var thisDay = stringResponse.split(" ")[1]; // 06
            var thisDay = thisDay.trim(); //get rid of any spaces
                months.push(thisMonth_Num);
                days.push(thisDay);
        }
    }
}); 

function addDates(date){
    //Weekends are NOT selectable
    if (date.getDay() == 0 || date.getDay() == 6) {
        return [false, ""];
    }

    //Using AJAX call above, all RETURNED dates are selectable
    for (var x = 0; x < days.length; x++) {
        if (date.getMonth() == months[x] - 1 &&
            date.getDate() == days[x]) {
            return [true, ""];
        }
    }

    //If dates are not from above, they are NOT selectable
    return [false, ""];
}

var DP_options = {
    beforeShowDay: addDates
};

$("#dateInput").datepicker(DP_options);
});

我也接受了Pointy关于用var声明x变量的建议。

Answer 2

https://stackoverflow.com/a/14162635/886591

我试图做一些非常相似的事情虽然对于angularJS我使用了Ben Nadel的queryToArray函数，但生活变得更加轻松。

点击这里的帖子https://stackoverflow.com/a/14162635/886591

从CFC JSON响应中访问信息

2 个答案: