Question

由于某些原因，当我通过ajax加载时，我的事件数据与jquery fullcalendar无法正常工作。但是，ajax请求肯定会返回正确格式化的JSON数据 - 如果我只是复制并粘贴返回的数据并在初始化日历时硬编码到事件源中，一切正常！这是我的代码 - 任何想法可能是什么问题？

$(document).ready(function() {
    // This is the data returned by the AJAX request - works fine when hard coded
    var data = 
            [{"title":"Test Event","description":"<p>Tester<\/p>","start":"1329264000","end":"1329264000","className":"sport junior_school"}];        

        var cal = $('#calendar').fullCalendar({
            header: {
                left: 'prev,next today',
                center: 'title',
                right: 'month,agendaWeek,agendaDay'
            },
            editable: true,
            eventSources: [
                '<?php echo Url::base()?>school-calendar/fetch_events'
                //data
            ]
        });  
});

Answer 1

在您从评论讨论中链接的页面中，您没有使用您在帖子中显示的代码。在您的实际页面中，您将名为data的var设置为对$.getJSON的调用的返回值，然后将data作为事件源传递给fullCalendar。< / p>

var data = $.getJSON('http://staging.jem-digital.com/lathallan/public_html/school-calendar/fetch_events');

$('#calendar').fullCalendar({
    //blah blah...
    eventSources: [
        data
    ],
    //blah blah...
});

问题在于$.getJSON返回jQXHR个对象，而fullCalendar不能将这样的对象作为数据源。

在Firebug中，如果我清空您的#calendar元素并运行以下内容，我会在日历上收到一个事件：

$('#calendar').fullCalendar({
  header: {
    left: 'prev,next today',
    center: 'title',
    right: 'month,agendaWeek,agendaDay'
  },
  editable: true,
  eventSources: [
    'http://staging.jem-digital.com/lathallan/public_html/school-calendar/fetch_events'
  ],
  eventRender: function (event, element) {
    element.qtip({
      content: {
        text: formatEvent(event), 
        title: {
          text: event.title,
          button: true
        }
      },
      show: {
        event: 'click', // Show it on click...
        solo: true // ...and hide all other tooltips...
      },
      hide: false,
      style: {
        classes: 'ui-tooltip-light ui-tooltip-shadow ui-tooltip-rounded'
      }
    });
  }
});

或者，如果您真的想要运行自己的AJAX调用，那么您需要在$.getJSON的成功回调中将数据传递给日历。这是这种事情的一种变体：

$.getJSON('http://staging.jem-digital.com/lathallan/public_html/school-calendar/fetch_events', function (data) {
    $('#calendar').fullCalendar({
        //blah blah...
        eventSources: [
            data
        ],
        //blah blah...
    });
});

但是，我认为后者没什么好处。

jquery fullcalendar - 事件数据的奇怪问题

1 个答案: