3

jquery の datepicker を使用して日付を選択していて、いくつかの日付を強調表示したいのですが、beforeShowDayで奇妙な問題が発生しています。

ページが読み込まれると、json データが読み込まれたように見えますが、入力ボックスをクリックして日付ピッカーが表示されても、何も強調表示されません。前の月または前の月をクリックすると、前月のデータがロードされます (たとえば、入力をクリックします -> 日付ピッカーが表示されます -> ハイライトなし -> 翌月をクリックします -> 前月のデータがハイライト表示されます)...

私は長い間グーグルで検索し、すべての前にデータがロードされているかどうかを確認しましたが、どういうわけかこの動作は変わっていません. どちらの日付ピッカーでも同じ問題が発生します。

(jquery-ui 日付ピッカー 1.10.1、jquery 1.9.1)

どのヒントも嬉しい！

var resDates;
var done = false;

function markDate(date) {
    var ret = [true, 'free'];

    if (!done) {
        $.ajax({
            dataType: "json",
            url: "modules/OutShop/getReservations.php",
            data: {item_id: $("#item-id").val()},
            async: false,
            success: function (dates) {
                resDates = dates;
                done = true;
            }
        });
    }


    $.each(resDates, function(key, value) {
        var d = (date.getFullYear() + "-" + ("0" + date.getMonth()).slice(-2) + "-" + ("0" + date.getDate()).slice(-2));
        if (d == value["day"]) {
        //$("body").append("d: " + d + ", v: " + value["day"] + ", s: " + value["status"] + "  ");
        //$("body").append("s: " + value["status"] + "  ");
            if (value["status"] == "1")
                ret = [false, 'marked'];
            else if (value["status"] == "2")
                ret = [false, 'reserved'];
            else
                ret = [true, 'free'];
        }
    });

    return ret;
}

$(document).ready(function() {


    if (!done) {
        $.ajax({
            dataType: "json",
            url: "modules/OutShop/getReservations.php",
            data: {item_id: $("#item-id").val()},
            async: false,
            success: function (dates) {
                resDates = dates;
                //done = true;
            }
        });
    }

    $("#item-datepicker-min").datepicker({
        showButtonPanel: true,
        defaultDate: +3,
        minDate: +3,
        beforeShowDay: markDate,
        onSelect: function(selectedDate) {
            $("#item-datepicker-max").datepicker("option", "minDate", selectedDate);
        }
    });

    $("#item-datepicker-max").datepicker({
        showButtonPanel: true,
        minDate: +3,
        defaultDate: +6,
        beforeShowDay: markDate,
        onSelect: function(selectedDate) {
            $("#item-datepicker-min").datepicker("option", "maxDate", selectedDate);
        }
    });
});

EDIT 詳細情報: これは、ajax 応答から取得した json オブジェクトの例です。

[{"ステータス":3,"日":"2013-04-10"},{"ステータス":3,"日":"2013-04-11"},{"ステータス":3,"日":"2013-04-12"},{"状態":3,"日":"2013-04-13"},{"状態":2,"日":"2013-04-10"} ,{"状態":2,"日":"2013-04-11"},{"状態":2,"日":"2013-04-12"},{"状態":2,"日":"2013-04-13"}]

4

1 に答える 1

1

月が 1 オフセットされているように見えます。javascript メソッド date.getMonth() は月をゼロベースで返し (例: 1 月は 0、2 月は 1)、PHP スクリプトは通常の形式で日付を返します (1 月は 1、2 月は 2 月)。は 2)

これをチェック

だから変えたら

var d = (date.getFullYear() + "-" + ("0" + date.getMonth()).slice(-2) + "-" + ("0" + date.getDate()).slice(-2));

に

var d = (date.getFullYear() + "-" + ("0" + date.getMonth()+1).slice(-2) + "-" + ("0" + date.getDate()).slice(-2));

正しい月が表示されるはずです

于 2013-03-15T20:54:45.507 に答える