FullCalendar: Add an event by the day of the week

Question

I'm building a grade school, I have a bunch of disciplines and it's day of the week. I need to insert these disciplines into the calendar. The problem is:
There is no way to add only by the day of the week. See:

Today is Sunday( 04/09/2016 ). But the calendar days are from the PAST week.

So, if you have:

var day = 'monday';

When you are going to insert an event in runtime you'd do like so:

$('#calendario').fullCalendar(
  'renderEvent',
  {                     
    id: id 
    title:  $(this).find('a').text(),   
    start: year+ '-' +month+ '-' +day+ 'T' + startTime,
    end:   year+ '-' +month+ '-' +day+ 'T' + endTime,
    backgroundColor: color,
    className: someClass
  }
)

As you can see, I HAVE TO specify dayof the month.

The problem is: Even using weekView, I can't work with events using only week days... I have to give the entire date(YYYY-MM-DD).
Today is sunday(04/09/2016). The calendar is half last month, half current month. How am I supposed to insert an event only by the day of the week ?

Also tried working with momentjs.

moment().day(1).hours(10).minutes(0).format('YYYY-MM-DD')

moment will return the second day of the week (0 - sunday, 1 - monday ), wich is 05 (currently week) and not the same as fullCalendar 29(last week). So I have no Idea how to insert my disciplines/events into the calendar.

score 0 · Answer 1 · answered Sep 06 '16 at 16:58

You can provide events as a function and loop through the time period currently displayed, creating events on specific days

https://jsfiddle.net/0roafa2f/

$('#calendar').fullCalendar({
    events: dowEvents
});

function dowEvents(start, end, tz, callback) {
  var events = [];
  var curr = start;
  while(curr <= end) {
    if(curr.format('dddd') === 'Monday') {
        events.push({
        title: 'Monday event',
        start: moment(curr)
      });
    }
    curr = curr.add(1, 'day');
  }
  callback(events);
}

score 0 · Answer 2 · answered Jan 18 '19 at 09:18

According to the source code of the demo on this page: https://fullcalendar.io/ meanwhile, events is an array object that can be listed manually, fetched from a url with json response or fetched from a function as stated here: https://fullcalendar.io/docs/event-data

$(function() {

  var todayDate = moment().startOf('day');
  var YM = todayDate.format('YYYY-MM');
  var YESTERDAY = todayDate.clone().subtract(1, 'day').format('YYYY-MM-DD');
  var TODAY = todayDate.format('YYYY-MM-DD');
  var TOMORROW = todayDate.clone().add(1, 'day').format('YYYY-MM-DD');

  $('#calendar').fullCalendar({
    header: {
      left: 'prev,next today',
      center: 'title',
      right: 'month,agendaWeek,agendaDay,listWeek'
    },
    editable: true,
    eventLimit: true, // allow "more" link when too many events
    navLinks: true,
    events: [
      {
        title: 'All Day Event',
        start: YM + '-01'
      },
      {
        title: 'Long Event',
        start: YM + '-07',
        end: YM + '-10'
      },
      {
        id: 999,
        title: 'Repeating Event',
        start: YM + '-09T16:00:00'
      },
      {
        id: 999,
        title: 'Repeating Event',
        start: YM + '-16T16:00:00'
      },
      {
        title: 'Conference',
        start: YESTERDAY,
        end: TOMORROW
      },
      {
        title: 'Meeting',
        start: TODAY + 'T10:30:00',
        end: TODAY + 'T12:30:00'
      },
      {
        title: 'Lunch',
        start: TODAY + 'T12:00:00'
      },
      {
        title: 'Meeting',
        start: TODAY + 'T14:30:00'
      },
      {
        title: 'Happy Hour',
        start: TODAY + 'T17:30:00'
      },
      {
        title: 'Dinner',
        start: TODAY + 'T20:00:00'
      },
      {
        title: 'Birthday Party',
        start: TOMORROW + 'T07:00:00'
      },
      {
        title: 'Click for Google',
        url: 'http://google.com/',
        start: YM + '-28'
      }
    ]
  });
});

score 0 · Answer 3 · answered Jun 22 '21 at 17:22

As far i understand if you want the event to be based on days like(sun,mon,tues) etc you can use dow it accepts array [0,1,2,3,4,5,6] sun,mon,tues respectively. Use start:"00:00:00" if you want it to repeat every day. e.g Try this

 events.push({
    start: '00:00:00',
    title: 'recursive event', 
    dow: [0,1,2] // each sun,mon,tues
      })

FullCalendar: Add an event by the day of the week

3 Answers3