4

jQuery の datepicker beforeShowDay イベントを使用しています。カレンダーで日付を有効にする必要があるかどうかを確認します。最初に PHP でページの読み込みをチェックする日付を取得しましたが、今は ajax リクエスト (Wordpress を使用しています) でそれらの日付を取得したいのですが、それがわかりません。

これが私のコードです:

$(function() {  
    var enabledDays = [];        

    function openedDays() {
        var data = {
            action: 'get_dates',
            zaal: <?php echo $zaal_id; ?>,
            async: false,
            dataType: 'json'
        };

        $.getJSON(ajaxurl, data, function(response) {
            $.each(response, function(key, value) {
                enabledDays.push(value);  
            });
            //works, console.log(enabledDays) shows here an array of dates: ["9-8-2012","9-10-2012"] 

            //add option beforeShowDay to datepicker? (does't work yet)
            $(this).datepicker('option','beforeShowDay',enableAllTheseDays); 

        });

    }


    function enableAllTheseDays(date) {
        //how to get value of the enabledDays variable in here

        var m = date.getMonth(), d = date.getDate(), y = date.getFullYear();

        for (i = 0; i < enabledDays.length; i++) {
            if($.inArray((m+1) + '-' + d + '-' + y,enabledDays) != -1) {
                //return true(enable date in Current Days Open calendar) if date is in array, add class 'ui-datepicker-opened-day' and tooltip 'opened' to it.
                return [true,'ui-datepicker-opened-day','opened'];
            }
        }            

        //return false(disable date in Current Days Open calendar) if date isn't in both of the arrays, and add tooltip 'closed' to it.    
        return [false,'ui-datepicker-closed-day','closed'];

    }


    //show Current Days Open Calendar
        $( "#currentdays" ).datepicker({
            dateFormat: "dd-MM-yy",
            changeMonth: true,
            numberOfMonths: 1,
            minDate: 0,
            beforeShow: openedDays
        });  

});

enableAllTheseDays 関数を実行する前に、openedDays 関数から日付を取得する方法を見つける必要があるため、enableAllTheseDays 関数で enabledDays 変数を使用できます。

4

1 に答える 1

1

onLoad() 関数で datepicker を 1 回インスタンス化し、beforeShowDay()その時点でメソッドを定義します。beforeShowDay()日付ピッカーが表示されるたびに呼び出され、毎回日付を反復処理できます。

$(function(){
    $("your-selector").datepicker({
        beforeShowDay: function(date) {
            // Either put the enable days code here (I prefer this route)
            // or call it from here: return enableAllTheseDays(date);
            // or define beforeShowDay as beforeShowDay: enableAllTheseDays.
            // It will run each time the date picker is displayed.
        }
    });

    // Now setup your ajax call to load your dates into enabledDays
    // Do not call datepicker again
    $.getJSON(ajaxurl, data, function(response) {
        $.each(response, function(key, value) {
            enabledDays.push(value);
        });
    });
});
于 2013-01-31T14:16:35.107 に答える