reloading AJAX data for Zabuto Calendar after moda

Question

I am making a time management system for a company.

I used Zabuto Calendar in conjunction with User Frosting, both very excellent projects.

However, I am struggling to get Zabuto to reload it's JSON data on a modal dismissal.

If you imagine, after the onclick is called for a specific date on the calendar, and values are entered, the user would want to close the modal window, and continue to the next date.

The monthly calendar view displays each date with various grades of color to represent whether the day has events or not.

When the user dismisses the modal, the calendar does not update its JSON data.

http://zabuto.com/dev/calendar/examples/show_data.html

Here is an example of how zabuto calendar works ^^

$("#ts-calendar").zabuto_calendar({
    action: function () {
        return myDateFunction(this.id, false);
    },
    action_nav: function () {
        return myNavFunction(this.id);
    },
    ajax: {
        url: "/api/sql/show_data.php?action=1&user=<? echo $loggedInUser->user_id; ?>",
        modal: true
    },
    show_days: true, 
    weekstartson: 0,
});

Answer 1

Okay, so I guess this is a sufficient workaround, since the original code already utilises AJAX to load data, a simple way to reload the data would be to reload the calendar.

So if anyone is struggling with the same issue, just copy your calendar code / script into a new file, load it on DOM ready, and then you can trigger the function to load the calendar whenever you need.

You will need to pass the month and year from the modal to the calendar as if you are working on a different month to the current month, the calendar will reload to the current month instead of the one you have the modal open on.

Hope this helps.