Roxy521
Roxy521

Reputation: 71

Full Calendar to remember selected view and date range

I would like the Full calendar scheduler to remember the current view and date range. I've got the view working, but it always defaults to the current date.

Code snippet:

var defaultView = (localStorage.getItem("fcDefaultView") !== null ? localStorage.getItem("fcDefaultView") : "timelineFiveDays");
var defaultStartDate = (localStorage.getItem("fcDefaultStartDate") !== null ? localStorage.getItem("fcDefaultStartDate") : null);
var defaultEndDate = (localStorage.getItem("fcDefaultEndDate") !== null ? localStorage.getItem("fcDefaultEndDate") : null);

$('#calendar').fullCalendar(
{    
    defaultView: defaultView,
    visibleRange:
    {
    start: defaultStartDate,
    end: defaultEndDate
    },
    viewRender: function(view, element)
    {  
    localStorage.setItem("fcDefaultView", view.name);
    localStorage.setItem("fcDefaultStartDate", view.start);
    localStorage.setItem("fcDefaultEndDate", view.end);
    }
}

Many thanks for any help

Upvotes: 2

Views: 2111

Answers (2)

V1pr
V1pr

Reputation: 159

IMHO, the problem is, that the localstorage returns a string containing the date, while the 'initialDate' expects a Date object! I ended up with this solution (for Fullcalendar v6 init):

var calendarEl = document.getElementById('myCalendar');
let calendar = new Calendar(calendarEl, {
   ....
   initialDate: ( localStorage.getItem("fcDefaultStartDate") !== null ? Date.parse(localStorage.getItem("fcDefaultStartDate")) : new Date() ),
   ...
}

Upvotes: 0

Roxy521
Roxy521

Reputation: 71

I finally got it working by using the gotoDate

var defaultView = (localStorage.getItem("fcDefaultView") !== null ? localStorage.getItem("fcDefaultView") : "timelineFiveDays"); 
var defaultStartDate = (localStorage.getItem("fcDefaultStartDate") !== null ? localStorage.getItem("fcDefaultStartDate") : moment()); 
defaultView: defaultView, 
$('#calendar').fullCalendar('gotoDate', defaultStartDate); 

As mentioned by @ADyson I might try the defaultDate rather than using the goToDate method

Upvotes: 2

Related Questions