Question

我正在制作CakePHP应用程序，目前我正在编写脚本来发出ajax请求以突出显示jQuery datePicker的保留日期，并且onSelect使用jQuery Accordion创建另一个Ajax请求以显示特定日期的预留信息。

但是，我的日历没有显示，我在Firebug控制台中出错 - ＆＃34;类型错误：O未定义。 function i（t，i）{in jquery-ui.custom.min.js file＆＃34;。在实施有些日子的重点之前，脚本工作得很好。

查看（calendar.ctp）：

<?php 
    $this->set('title_for_layout', __('Calendar'));
    $this->Html->css('jquery-ui.custom', null, array('inline' => false));
    $this->Html->script('jquery-ui.custom.min', array('inline' => false));  
?>
<div class="row">
    <div class="span3" id="datepicker"></div>
    <div class="span7" id="hours"></div>
</div>

我的剧本：

$(document).ready(function() {
    $.ajax({
        url: '<?php echo Router::url(array('controller' => 'streservations', 'action' => 'highlight'), true);?>',
        type: "GET",
        cache: false,           
        data: {
            action : 'showdates'
        },
        dataType: 'json',
        success: function(reservations){   
            //alert(reservations[0][0]);
            console.log(reservations);
            $( "#datepicker" ).datepicker({ //initialize datepicker
                defaultDate: '<?php echo $this->Time->format('Y-m-d', time()) ?>',
                maxDate: '<?php echo $this->Time->format('Y-m-d', '+1 month') ?>',
                dateFormat: 'yy-mm-dd',
                beforeShowDay: function(date){                        
                    var y = date.getFullYear().toString(); // get full year
                    var m = (date.getMonth() + 1).toString(); // get month.
                    var d = date.getDate().toString(); // get Day
                    if(m.length == 1){ m = '0' + m; } // append zero(0) if single digit
                    if(d.length == 1){ d = '0' + d; } // append zero(0) if single digit                        
                    var currDate = y+'-'+m+'-'+d;
                    console.log(currDate);
                    /*
                    $.each(reservations, function(k, v){
                        //alert(v.date + ' ' + v.count);
                        if(v.date == currDate && v.count > 3){
                            return [true, "ui-highlight"];
                        }
                        else{
                            return [true];
                        }
                    });
                    /*for(var i = 0; i < reservations.lenght; i++){
                        alert(reservations[i][1]);
                        if(*reservations[i][1] == currDate*reservations.indexOf(currDate) >= 0){
                            return [true, "ui-highlight"];  
                        }else{
                            return [true];
                        }
                    }*/                     
                },
                onSelect : function(dateText,inst) //when selecting date, make AJAX call to show accordion
                {
                    $.ajax({
                        url: '<?php echo Router::url(array('controller' => 'streservations', 'action' => 'hours'), true);?>',
                        type: "GET",
                        cache: false,
                        dataType: 'json',
                        data: {
                            action: 'accord',
                            date: dateText
                        },
                        success: function(data){
                            $("#hours").accordion({collapsible: true, clearStyle: true, heightStyle: "content"});
                            $('#hours').empty();
                            $.each(data, function(k, v){
                                $('#hours').append('<li><h3><div>' + v.title + ' ' + v.start + '</div></h3><div>' + 'Operation: ' + v.name + '</br>' + 'Name: ' + v.title + '</br>'+ 'Time: ' + v.start + '</br>'+'</div></li>');
                            });
                            $("#hours").accordion( "refresh" );
                        }
                    });
                }
            });
        } 
    });
});

更新：所以，我将脚本版本更改为开发版本（jquery-ui.custom），现在我收到此错误：

TypeError：daySettings未定义

unselectable = (otherMonth && !selectOtherMonths) || !daySettings[0] ||

Answer 1

我想通了：我需要在beforeShowDay函数中返回数组：

               beforeShowDay: function(date){                        
                    var y = date.getFullYear().toString(); // get full year
                    var m = (date.getMonth() + 1).toString(); // get month.
                    var d = date.getDate().toString(); // get Day
                    if(m.length == 1){ m = '0' + m; } // append zero(0) if single digit
                    if(d.length == 1){ d = '0' + d; } // append zero(0) if single digit                        
                    var currDate = y+'-'+m+'-'+d;
                    console.log(currDate);                        
                    //return [true, "ui-highlight", ''];                         

                    for(var i = 1; i < reservations.lenght; i++){
                        console.log(reservations[i].date);
                        if(reservations[i].date == currDate){
                            return [true, 'ui-highlight', ''];  
                        }/*else{
                            return [true];
                        }*/

                    }
                    return [true, '', ''];
                },

但我的日子都没有突出显示，这段代码不知何为没有执行：

if(reservations[i].date == currDate){
                            return [true, 'ui-highlight', ''];  
                        }

我的预订JSON数组是：[Object { date="2014-07-18", count="3"}, Object { date="2014-08-05", count="1"}, Object { date="2014-08-06", count="2"}]

Answer 2

也许是因为拼错了“长度”错误：

 for(var i = 1; i < reservations.lenght; i++){

jQuery UI datepicker - TypeError：O未定义

2 个答案: