Hello, I set up the date picker on my site. It works really well and I’m very happy with it. I just have a concern that I can’t fix. When I am on the calendar, I click on a given date (except today’s date), I go to an event scheduled for this date via a new page. I’m using the navigation buttons to go back to the calendar and I have another button on my page that does the same thing with the history.go (-1) command. It works great on Mozilla, safari because it keeps the date we were on. But on Chrome, without my understanding why, the calendar is fully recharged and suddenly, it is positioned on the date of the day. I tried to change the events by testing with the “onInit” function or with the “onPageLoading” function but the result is the same. Have you ever encountered this concern? If yes, can you give me a solution?
The Mobiscroll calendar does not have built in state handling, meaning it does not keep the selection between page reloads.
When going back in the browser history, it depends on the browser, how it handles the page load. In some cases it will display a cached version of the page, as it was left, in other cases it will be a full page reload.
I will look into this to see if there’s any way to control this, to make it consistent.
Could you notify me when you have found a way to manage this, the idea of keeping the calendar state as it was when the user selected a date, can help simplify navigation in my case.
One possible solution to solve this would be to store the selected date in the localStorage on date selection, and when returning to the calendar page, check the localStorage, and if there’s a date stored, set it as the calendar value:
$('#cal').mobiscroll().calendar({
display: 'inline',
onDayChange: function (ev) {
var dateStr = mobiscroll.util.datetime.formatDate('yy-mm-dd', ev.date)
// Save the date in the local storage
window.localStorage.setItem('selectedDate', dateStr);
// Navigate to some page
window.location.href = "https://google.com"
}
});
// Check the localStorage for the date
var selectedDate = window.localStorage.getItem('selectedDate');
if (selectedDate) {
// If any, set the calendar value
$('#cal').mobiscroll('setVal', selectedDate);
}