0

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

所以我正在使用 jQueryUI 的日期选择器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和变量,并且 addDates 函数将使用这些变量来启用它们。days

如何将 JSON 响应中的信息推送到monthsdays变量?还是我错过了一步?

4

2 回答 2

1

听从亚当的建议,我拆开了我的 JSON 响应。我犯的一个重要错误是没有查看教程并看到 JSON 响应需要单独的MONTHDAY列。我只是假设一个 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 的建议,即用 . 声明 x 变量var

于 2013-08-06T20:07:23.410 回答
0

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

我试图做一些非常相似的事情,尽管对于 angularJS,我使用了 Ben Nadel 的 queryToArray 函数,生活变得轻松多了。

在这里查看帖子https://stackoverflow.com/a/14162635/886591

于 2013-08-05T22:59:31.917 回答