2

I am trying to count the events per day on fullcalendar but I am getting the wrong output. what I am trying to do is group and count the event per day and group by resources. but the output is just grouping it and assigning it on the 1st resource group

This is my fiddle

eventRender: function(event, element) {
    flagEvent(event, element);
    if (event.end && event.start.format('YYYY-MM-DD') !== event.end.format('YYYY-MM-DD')) {
      while (event.end > event.start) {
        event.start.add(1, 'day');
        console.log('flag', event.start.format('YYYY-MM-DD'))
        flagEvent(event, element);
      }
    }
  },
  eventAfterAllRender: function(view) {
    $('#calendar .fc-day.fc-widget-content').each(function(i) {
      var date = $(this).data('date'),
        count = $('#calendar a.fc-event.event-on-' + date).length;
      if (count > 0) {
        $(this).html('<div class="fc-event-count">' + (count) + '<div>');
      } else {
        $(this).html('<div class="fc-event-count"><div>');
      }
    });

  },

This should be the output base on the given data:

enter image description here

Nazim Kerimbekov
  • 4,712
  • 8
  • 34
  • 58
  • 1
    rather than trying to count the HTML elements, just use https://fullcalendar.io/docs/v3/clientEvents to get all the event data objects in an array. Then you can look at the date range of each one and decide which day(s) and which resources it occurs on. – ADyson Jun 14 '19 at 09:36
  • 1
    P.S. If you'd used your element inspector in your browsers' Developer Tools to see what area of the calendar is covered by each `.fc-day.fc-widget-content` element you'd see that only one of these occurs per day. They are not split up per resource. – ADyson Jun 14 '19 at 09:40
  • 1
    The resource lines are then overlaid separately in a different layer of HTML, under the ".fc-rows" class. The grid system you are seeing on screen is an illusion created by layering of the HTML elements. There is actually no grid in reality in the timeline view. So therefore there's no physical location where you can write your numbers for a specific resource/day combination. So even if you can count the data accurately, you can't achieve what you want by this method. – ADyson Jun 14 '19 at 09:47
  • 1
    If you really want to do this, you would be better to simply replace your existing event data with a list of events, one per each day which contains an event, where the event's title is just a count of the events on that day. You could get your server to send that information directly, rather than providing the raw event information as it presumably does now. – ADyson Jun 14 '19 at 09:51

0 Answers0