Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to only view business hours in a fullCalendar agenda view

Tags:

fullcalendar

enter image description here

I want to show only business hours in a daily agenda view from 8:30 to 17:00, like below:

enter image description here

like image 671
Osama Sbieh Avatar asked Jan 07 '16 14:01

Osama Sbieh


People also ask

How do I turn off weekends in fullCalendar?

Just go from the startDate to the endDate and check if any of those days are weekends. If so, display the alert / popup and return false. select: (start, end, allDay) => { var startDate = moment(start), endDate = moment(end), date = startDate. clone(), isWeekend = false; while (date.

How do I set events in fullCalendar?

Here is an example of how to specify an array of events: var calendar = new Calendar(calendarEl, { events: [ { title : 'event1', start : '2010-01-01' }, { title : 'event2', start : '2010-01-05', end : '2010-01-07' }, { title : 'event3', start : '2010-01-09T12:30:00', allDay : false // will make the time show } ] });

How do I display an image in fullCalendar?

You can add any image url to your eventObject by adding the attribute "imageurl" inside of the events definition (if you just want the image, don't specify a title):

How do I change the date on fullCalendar?

The calendar's dates can change any time the user does the following: click the prev/next buttons, change the view, click a navlink. The dates can also change when the current-date is manipulated via the API, such as when gotoDate is called. datesSet is called after the new date range has been rendered.


1 Answers

Are you asking how to hide hours outside of business hours? If so, use the minTime and maxTime options:

http://fullcalendar.io/docs/agenda/minTime/

http://fullcalendar.io/docs/agenda/maxTime/

for instance, for a 9am - 5pm calendar:

$(document).ready(function() {

    $('#calendar').fullCalendar({
        ...
        minTime: "09:00:00",
        maxTime: "17:00:00",
        ...
    });
});
like image 83
scottysmalls Avatar answered Oct 05 '22 22:10

scottysmalls