jquery fullcalendar - странная проблема с данными события - PullRequest
0 голосов
/ 01 февраля 2012

по некоторым причинам мои данные о событиях не работают правильно с jquery fullcalendar, когда я загружаю его через ajax.Однако 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
            ]
        });  
});

1 Ответ

1 голос
/ 01 февраля 2012

На странице, на которую вы ссылались в обсуждении комментариев, вы не используете код, который вы указали в своем сообщении. На вашей реальной странице вы устанавливаете переменную с именем data для возвращаемого значения вашего вызова на $.getJSON, а затем передаете data в fullCalendar в качестве источника события.

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...
    });
});

Однако я не вижу особой пользы для последнего.

...