Question

我已将FullCalendar版本从版本2.3.1升级到2.4.0，然后才能正常运行，但现在在week view和agenda view我可以＆＃39;添加事件。事情很奇怪，因为month view我看到了约会和其他事件。我使用此代码添加事件：

$.each(response, function(index, rsp) 
        {
              $.each(rsp.appointments, function(index, appointment)
              {               

                  var check = GeneralFunctions.checkOperatorExistence(myMap, appointment['provider']['first_name']);

                  if(check.length > 0)
                  {
                      var operatore_info = check.split(",");
                      var column_operator = Number(operatore_info[1]);

                        var event =
                        {
                              'id': appointment['id'],
                              'title': appointment['service']['name'] + ' - '
                              + appointment['customer']['first_name'] + ' '
                              + appointment['customer']['last_name'],
                              'start': appointment['start_datetime'],
                              'end': appointment['end_datetime'],
                              'allDay': false,
                              'color': '#' + appointment['res_id']['hex_color'],
                              'data': appointment,
                              'column': column_operator
                        };

                      calendarEvents.push(event);
                   }
              })
        });                         

        $calendar.fullCalendar('removeEvents');
        $calendar.fullCalendar('addEventSource', calendarEvents);

我的代码执行ajax请求并为我系统中保存的每个提供程序插入约会。我的代码中可能出现了错误，可能是因为版本发生了变化？我在系统中遇到任何错误。

jsfiddle

更新

如果我点击日程视图或周视图的特定日期，我会收到此错误：

未捕获的TypeError：无法读取属性＆＃39; top＆＃39;未定义的未捕获的TypeError：无法读取属性＆＃39; length＆＃39;是的 fullcalendar.js：2026 Uncaught TypeError：无法读取属性＆＃39; length＆＃39;为null

导入库

 <link rel="stylesheet" type="text/css"
    href="<?php echo $base_url; ?>assets/css/libs/jquery/fullcalendar.css" />

<script type="text/javascript"
        src="<?php echo $base_url; ?>assets/js/libs/jquery/jquery.min.js"></script>

<script type="text/javascript"
        src="<?php echo $base_url; ?>assets/js/libs/jquery/moment.min.js"></script>

<script type="text/javascript"
        src="<?php echo $base_url; ?>assets/js/libs/jquery/fullcalendar.js"></script>

<script type="text/javascript" 
        src="<?php echo $base_url; ?>UI/multicolumn/fullcalendar-columns.js"></script>  

<script type="text/javascript"
        src="<?php echo $base_url; ?>assets/js/libs/jquery/fullcalendar-it.js"></script>

<script type="text/javascript"
        src="<?php echo $base_url; ?>assets/js/libs/jquery/jquery-ui.min.js"></script>

<script type="text/javascript"
        src="<?php echo $base_url; ?>assets/js/libs/jquery/jquery.qtip.min.js"></script>

<script type="text/javascript"
        src="<?php echo $base_url; ?>assets/js/libs/bootstrap/bootstrap.min.js"></script>

<script type="text/javascript"
        src="<?php echo $base_url; ?>assets/js/libs/jquery/jquery-ui-timepicker-addon.js"></script>

<script type="text/javascript" 
        src="<?php echo $base_url; ?>assets/js/backend_calendar.js"></script>

<link rel="stylesheet" type="text/css"
        href="<?php echo $base_url; ?>assets/css/custom/custom.css"</script>

可能有帮助吗？

INIT日历设置

$('#calendar').fullCalendar({
        'defaultView': 'multiColAgendaDay',
        'height': BackendCalendar.getCalendarHeight(),
        'editable': true,
        'firstDay': 1,          //Lunedì
        'slotMinutes': 60,
        'slotDuration': '00:30:00',
        'slotLabelFormat': 'h(:mm)a',
        'timeFormat': 'H(:mm)',
        'allDayText': EALang['all_day'], 
        'columnFormat': 
        {
            'month': 'ddd',
            'week': 'ddd D',
            'day': 'dddd'
        },
        'titleFormat': 
        {
            'month': 'MMMM YYYY',
            'week': 'MMM D YYYY',
            'day': 'MMMM D YYYY'
        },
        'header': 
        {
            'left': 'prev,next today',
            'center': 'title',
            'right': 'multiColAgendaDay,multiColAgendaWeek,month'
        },
        'views':
        {
            'multiColAgendaDay':
            {
                'type': 'multiColAgenda',
                'duration': { days: 1},
                'columns': updated
            },
            'multiColAgendaWeek':
            {
                'type': 'multiColAgenda',
                'duration': { weeks: 1 },
                'columns': updated
            }
        },

我将外部资源用于多列，如下所示：https://github.com/mherrmann/fullcalendar-columns

Answer 1

它适用于fullcalendar 2.3.1（你的小提琴使用的是2.4.0）

http://jsfiddle.net/jkmda709/34/

/*fullcalendar-columns

A FullCalendar extension that adds support for multiple columns (/resources) per day. Tested with FullCalendar v2.3.1, but likely to be compatible with other versions.*/

FullCalendar不会添加任何事件（周视图，议程视图）

1 个答案: