Mobillscrol, history on Chrome

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?

Thank you so much,

Best regards
Olivier

Noboby can help me ?

Hi, thanks for the question.

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.

Hi,

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.

Thanks for your help :wink:

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);
}

Hello, thank you very much for your post. indeed, I hadn’t thought of using that at all. And I just tested it and it works really well. thanks again

Olivier