Подтвердить что ты не робот

События FullCalendar, отображаемые только в режиме месяца

Я использую FullCalendar http://fullcalendar.io/ для отображения некоторых событий на веб-странице.

Календарь создается следующим образом

$('#calendar').fullCalendar({
        header: {
        left: 'prev,next today',
        center: 'title',
        right: 'month,agendaWeek,agendaDay'
        },
        allDayDefault: false,
        selectable: true,
        selectHelper: true,
        editable: true,
        eventLimit: true, // allow "more" link when too many events
   });

События создаются с помощью операции renderEvent (не json-канал), например

$('#calendar').fullCalendar('renderEvent', newEvent, 'stick');

где newEvent создается следующим образом

newEvent = {
                title : 'mytitle',
                start : startDate,
                allDay: false,
                id: eventId,
                description: 'my test event'
            };

проблема в том, что события корректно отображаются в виде месяца, но не отображаются в виде недели или дня.

UPDATE

Я использую этот формат даты: 2015-02-01T01: 00: 00

4b9b3361

Ответ 1

Я создал плункер, воспроизводящий ваш код. Единственная проблема, которую я вижу в вашем коде, - это запятая, ожидаемая при создании события.

Итак, я создаю событие с новым моментом объекта, который теперь означает.

  var startDate = moment();
  var eventId = 123;
  var newEvent = {
                title : 'mytitle',
                start : startDate,
                allDay: false,
                id: eventId,   //Is this comma that was missing in your code
                description: 'my test event'
            };

И я добавляю его с тем же кодом, который вы делаете:

$('#calendar').fullCalendar('renderEvent', newEvent, 'stick');

Как вы можете проверить plunker, все работает нормально, поэтому единственная проблема, которую вы предоставляете нам, может иметь:

  • Отсутствует запятая.
  • Ошибка переменной eventId
  • Неверная startDate переменная

Кроме того, если вы посмотрите на документацию для render event, вы не используете переменную "stick" правильно. Он должен быть логическим. В вашем коде работает, потому что, поскольку вы можете проверить строку 9229 для версии 2.3.1, ее сравнивают как выражение, поэтому любая строка (не пустая) будет правдой. Вы можете получить дополнительную информацию об этом в этом ответе: fooobar.com/questions/185069/...

Итак, если вы установите третий палец параметра как:

  • True
  • 'палка'
  • 'антипригарные'
  • 'ложь'
  • 'независимо от'

... всегда разрешается как липкое и добавляется к stickySource. Но, как прокомментировал @slicedtoad, вы должны изменить его, чтобы избежать проблем в будущих версиях.

Ответ 2

В коде нет ничего плохого. Но вы делаете некоторые вещи нестандартным образом. Попробуйте их исправить, и проблема может исчезнуть.

Метод, который вы используете для добавления событий, неверен. В терминологии FullCalendar render означает процесс отображения данных в календаре. Поэтому, когда вы renderEvent, вы просто говорите ему, чтобы отображать событие на экране. И затем stick делает его упорным (вроде).

Вместо этого вы должны использовать addEventSource. Его можно использовать для добавления источника событий (локального или удаленного). И eventSource может быть чем угодно из JSON-канала в локальный массив одного события.

Это должно работать:

$('#calendar').fullCalendar('addEventSource',[{
    title : 'mytitle',
    start : startDate,
    allDay: false,
    id: eventId,
    description: 'my test event'
}]);

Это дает вам событие, которое будет длиться в течение всего сеанса. Он также имеет преимущество в том, чтобы хорошо играть со всеми другими параметрами fullcalendar и обратными вызовами.

Ответ 3

Я сделал fiddle, используя ваш код с некоторыми изменениями с моей стороны. Он работает нормально. Надеюсь, это сработает для вас. Ваши входы приветствуются.

код

HTML

<body>
    <div id='calendar'></div>
</body>

SCRIPT

<script type='text/javascript'>
$(document).ready(function(){
    fullCalObj = $('#calendar').fullCalendar({
         header: {
             left: 'prev,next today',
             center: 'title',
             right: 'month,agendaWeek,agendaDay'
         },
         allDayDefault: false,
         selectable: true,
         selectHelper: true,
         editable: true,
         eventLimit: true, // allow "more" link when too many events
     });

    var newEvent = {
        title : 'mytitle',
        start : '2015-04-22',
        allDay: false,
        id: 1,
        description: 'my test event'
    };

    fullCalObj.fullCalendar('renderEvent', newEvent, 'stick');
});
</script>