Search code examples
javascriptjqueryfullcalendarfullcalendar-3

Fullcalendar - Not able to display day names in Month view

I'm using full calendar 3.4 and trying to show day names in the month view, but nothing seems to work. Works fine in Week view though.

enter image description here

Tried multiple different things and here is my configuration:

$('#calendar').fullCalendar({

        defaultView: 'month',
        weekNumbers: true,
        selectable: true,
        selectHelper: true,
        selectOverlap: false,
        timeFormat: 'H:mm',
        firstDay: 1,
        views: {
            month: {
              columnHeaderFormat: 'ddd'
        }},


        header: {
            right: 'prev,next today',
            left: 'title',
            center: 'month,agendaWeek,agendaDay'
        } });

Any ideas how I can make it to work?

Solution

  • What momnet version you are using ? Try this code snippet. I can see day names in the header.

    (function($) {
  $(document).ready(function() {
    var fullcalendar = $('#calendar').fullCalendar({

      defaultView: 'month',
      weekNumbers: true,
      selectable: true,
      selectHelper: true,
      selectOverlap: false,
      timeFormat: 'H:mm',
      firstDay: 1,
      views: {
        month: {
          columnHeaderFormat: 'ddd'
        }
      },


      header: {
        right: 'prev,next today',
        left: 'title',
        center: 'month,agendaWeek,agendaDay'
      }
    });
  });
})(jQuery)
    <link href="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.4.0/fullcalendar.min.css" rel="stylesheet" />
<div id="calendar"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.4.0/fullcalendar.min.js"></script>