CODEWITHSUNDEEP
angularjsfullcalendar
Brant
Brant

Reputation: 1446

FullCalendar - Hide days in week labels

I'm using FullCalendar (2.3.1) with the ui-calendar (0.8.1) AngularJS directive. I need to hide the column headers that contain the days of the week (Sun, Mon, Tues, etc.). I can see where the calendar header can be configured (http://fullcalendar.io/docs/display/header/), but this doesn't include the headers for each column in the calendar, which contains the day of week labels.

I've been combing the docs, but can't find a way to toggle this. Is it possible to hide the day of week labels through a configuration parameter in FullCalendar itself, or perhaps in the ui-calendar directive?

Upvotes: 2

Views: 2699

Answers (2)

justinkredible56
justinkredible56

Reputation: 66

In your $scope.uiConfig.calendar object you can specify custom "Day" names. So if you wanted to some of them but not all of them or any combination in between you could do it like this.

$scope.uiConfig = {calendar:{ dayNames: ['', '', '', '', '', '', ''] } };

OR

$scope.uiConfig = {calendar:{ dayNames: ['Su', 'M', 'T', 'W', 'T', 'F', 'Sa'] } };

You can put whatever you want in there, allowing you to hide/show day names without editing the CSS.

Upvotes: 3

Patel
Patel

Reputation: 1478

All days cells ('Mon', 'Tue' etc..) belong to class 'fc-day-header' in FullCalendar. So, if all you want is to hide that header, you can do it like this : $('.fc-day-header').hide();

This should work for what you need.

Upvotes: 0

Related Questions