2

I need to pass current view type along with my ajax url within events function. I am using fullcalendar v4.3.1. Below is my code and what I am facing an issue that I always get previous view type when change the view.

var currentView = "dayGridMonth";
document.addEventListener('DOMContentLoaded', function() {
    var calendarEl = document.getElementById('calendar');

    var calendar = new FullCalendar.Calendar(calendarEl, {
        plugins: [ 'interaction', 'dayGrid', 'timeGrid', 'list' ],
        header: {
            left: 'prev,next today',
            center: 'title',
            right: 'dayGridMonth,timeGridWeek,timeGridDay,listMonth'
        },
        navLinks: true,
        businessHours: true,
        editable: true,
        events: function (info, successCallback, failureCallback) {
            jQuery.ajax({
                url: '/json/year_plan/get_full_calendar',
                type: 'get',
                dataType: 'json',
                data: {
                    start: formatDateObjToYMD(info.start),
                    end: formatDateObjToYMD(info.end),
                    currentView: currentView
                },
                success: function(doc) {
                    var events = [];
                        $.map( doc, function( r ) {
                            events.push({
                                id: r.year_plan_id,
                                title: r.title,
                                start: r.start,
                                end: r.end,
                                rendering: r.rendering,
                                color: r.color
                            });
                        });
                    successCallback(events);
                }
            });
        },
        viewSkeletonRender: function (info) {
            currentView = info.view.type;
        },
        lazyFetching:false,
    });

    calendar.render();
});

I am updating currentView variable everytime view is changed within viewSkeletonRender function. Then I use this updated variable is used within events function to send it through ajax. But it seems events function get calls before viewSkeletonRender function.

ADyson
  • 57,178
  • 14
  • 51
  • 63
Gayan Fernando
  • 581
  • 1
  • 7
  • 23
  • The view rendering and event fetching happens in parallel, asynchronously. So yes it's likely that the `currentView` won't be updated in time to supply it to your AJAX function. But why does your server need to know or care what the view type is? Surely all it needs to know is the date range to return events for (which is already provided by fullCalendar, as you know). Does the server do something different depending on the view type? And why does it do that? – ADyson Dec 04 '19 at 08:45
  • Did you still want any help with this, or have you solved it? – ADyson Dec 05 '19 at 09:34
  • @ADyson Yeah I still need the help. Indeed in the month view I am displaying only main events belongs to a date. In date view, I am displaying sub events which allocated to time range. So I need to send the current view to server to display main events or sub events. – Gayan Fernando Dec 08 '19 at 01:18
  • It won't work the way you've designed it, because of the reason I've already explained. I can think of another way which might work, although you'd have to try it out: Make two different [event sources](https://fullcalendar.io/docs/eventSources), both pointing at your server, but sending different parameters (to make it return the main or sub events). – ADyson Dec 08 '19 at 21:32
  • Then, handle the [viewSkeletonRender](https://fullcalendar.io/docs/viewSkeletonRender) callback - this executes whenever the view type is changed. In that callback, get the view type (from the supplied `info` object), and use it to [add](https://fullcalendar.io/docs/Calendar-addEventSource) and [remove](https://fullcalendar.io/docs/EventSource-remove) the different event sources as needed, depending on the view type. – ADyson Dec 08 '19 at 21:33
  • @ADyson the link to the documentation returns a 404, maybe you should make it redirect to the last version existing when no version number is sent through the URL, with a big deprecation notice on the page. Anyway, [viewSkeletonRender](https://fullcalendar.io/docs/v4/viewSkeletonRender) (v4) has been renamed [viewDidMount](https://fullcalendar.io/docs/view-render-hooks) (v5) and you should maybe use [viewClassNames](https://fullcalendar.io/docs/view-render-hooks) (v5) instead, as viewDidMount is not triggered when switching between similar views (e.G. resourceTimelineDay/resourceTimelineMonth) – LucileDT Feb 10 '22 at 14:30
  • @LucileDT I think you may be mistaking me for someone who has the ability to change the fullCalendar documentation :-). I have no association at all with the project. If you want to report an issue you can raise a ticket on the fullCalendar GitHub page. As for your suggestions, those would make sense in v5 of course, but this question is now more than 2 years old and is tagged specifically with v4, so I don't think it's especially relevant. – ADyson Feb 10 '22 at 21:54
  • Oh sorry, as you are really active on the FullCalendar tag, I wrongly assumed you were part of the development team, my bad – LucileDT Feb 22 '22 at 22:38
  • I just ran into this issue. My `/events` URL needs the current view to return specific rendered HTML for use in `eventContent` callback, but `view: currentView` is always 1 step behind, so it ends up rendering the events for the wrong view... I can return _all_ the HTML for each available view and render the proper one in `eventContent`, since `arg.view.type` is correct there, but that makes the JSON payload very large for. Or I can change `eventContent` to generate the HTML, etc. Would be nice if FC5 had `fetchInfo.view.intendedView` (or something) to target the view being changed to, but eh. – Tim Lewis Nov 16 '22 at 18:56

0 Answers0