javascript - How to create a full day event in fullcalendar - Stack Overflow

admin管理员组

文章数量:1315366

I am really stuck with this.How can i create a full day event in fullcalendar when clicked on a day.

dayClick: function (date, allDay, jsEvent, view) {

  var eventTitle = prompt('Provide Event title');

  if (eventTitle) {
    $('#calendar').fullCalendar('renderEvent', {
      title : eventTitle,
      allDay : true,
      stick : true,
    });
  }
}

I am really stuck with this.How can i create a full day event in fullcalendar when clicked on a day.

dayClick: function (date, allDay, jsEvent, view) {

  var eventTitle = prompt('Provide Event title');

  if (eventTitle) {
    $('#calendar').fullCalendar('renderEvent', {
      title : eventTitle,
      allDay : true,
      stick : true,
    });
  }
}

• javascript
• fullcalendar
• fullcalendar-3

Share Improve this question Follow edited Jan 26, 2023 at 9:02 ADyson 62.1k1616 gold badges7878 silver badges9191 bronze badges asked Jun 5, 2017 at 9:56 PoojaPooja 11311 gold badge22 silver badges77 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 4

You haven't actually said what's going wrong with this code, but it seems fairly obvious that you missed out the start and end dates. Otherwise how will the calendar know where you want to place the event? It doesn't take any implication from the fact that you called "renderEvent" from inside the "dayClick" method, that's just a coincidence. "renderEvent" can be called anytime and is independent. It expects you to tell it everything about the event you want to add.

If you'd checked your browser console after you tried to add the event, you'd have noticed an error "Cannot read property 'stripTime' of undefined" which would hopefully have given you a clue about the nature of the error, being related to time. You could also trace it back in the source to see what it was doing and what you had omitted to do.

Anyway, since you want this to be an all-Day event for a single day, you can use the date property supplied by the callback quite easily:

dayClick: function (date, allDay, jsEvent, view) {

  var eventTitle = prompt('Provide Event title');

  if (eventTitle) {
    $('#calendar').fullCalendar('renderEvent', {
      title : eventTitle,
      allDay : true,
      start: date, //specify start date
      stick : true,
    });
  }
}

Note that, as per https://fullcalendar.io/docs/event_data/Event_Object/, only "start" is required. "end" is optional and I haven't used it. If you specify "allDay: true" and only supply a start date, then fullCalendar will assume it's an all-day event for a single day.

For future reference: If you want to allow more flexibility in adding events (e.g. not all-day ones), you should use the "select" callback instead to allow users to specify the exact start and end times for the event by dragging their mouse on the calendar. https://fullcalendar.io/docs/selection/select_callback/

本文标签： javascriptHow to create a full day event in fullcalendarStack Overflow