CODEWITHSUNDEEP
javascriptjqueryhtmlcss
sathish kumar
sathish kumar

Reputation: 936

How to display more than one month on same page

I am using fullCalendar plugin. Here, how can I display 2 or more months on a same page. Please look at the below image. I want exactly how it is there in a image.

Image

In this image, july and august months are displaying simulatiously. I want to do like this using full Calendar plugin. Please help me how Can I do this?

jsfiddle

Here I added the full calendar example fiddle. Here only one moth is there. I want defaultly 3 months without clicking previous or next button.

$(document).ready(function() {

    var date = new Date();
    var d = date.getDate();
    var m = date.getMonth();
    var y = date.getFullYear();

    var events_array = [
        {
        title: 'Test1',
        start: new Date(2012, 8, 20),
        tip: 'Personal tip 1'},
    {
        title: 'Test2',
        start: new Date(2012, 8, 21),
        tip: 'Personal tip 2'}
    ];

    $('#calendar').fullCalendar({
        header: {
            left: 'prev,next today',
            center: 'title',
            right: 'month,agendaWeek,agendaDay'
        },
        selectable: true,
        events: events_array,
        eventRender: function(event, element) {
            element.attr('title', event.tip);
        }
    });
});
<div style="border:solid 2px red;">
        <div id='calendar'></div>
</div>

Upvotes: 1

Views: 570

Answers (1)

rejo
rejo

Reputation: 3350

add multiple calander ..

  <div id='calendar'></div>
  <div id='calendar1'></div>

set second calendar date to next month , like this

$('#calendar1').fullCalendar('gotoDate', new Date('12/10/2018'));

Upvotes: 1

Related Questions