Refetch events after addEvent in resourceTimeGridWeek view

[churrezno]

Hi @vkurko , thanx for the library. When I add an event in the main timeGridWeek view, it automatically appears in view after created, but in the resourceTimeGridWeek view it creates the event but it won´t appear in screen until I refresh the page. Is there any method or configuration I can use to make it work? Thanx in advance.

[vkurko]

Hi @churrezno Some code example so I can reproduce this issue would be very helpful.

[churrezno]

This is my config:

var ec = new EventCalendar(document.getElementById('ec'), {
            view: 'timeGridWeek',
            height: 'auto',
            headerToolbar: {
                start: 'prev,next today',
                center: 'title',
                end: 'timeGridWeek resourceTimeGridWeek'
            },
            buttonText: function (texts) {
                texts.today = 'hoy';
                texts.timeGridWeek = 'semana';
                texts.resourceTimeGridWeek = 'salas';
                return texts;
            },
            dayHeaderFormat: {
                weekday: 'narrow',
                month: 'numeric',
                day: 'numeric',
                omitCommas: true
            },
            resources: [
                { id: 257, title: 'Sala 1 coworking' },
                { id: 258, title: 'Sala 2 coworking' }
            ],
            theme: function (theme) {
                theme.hiddenScroll = '';    
                return theme;           
            },
            //scrollTime: '09:00:00',
            events: events,
            views: {
                timeGridWeek: { pointer: true },
                resourceTimeGridWeek: { pointer: true }
            },
            dayMaxEvents: true,
            nowIndicator: true,
            selectable: true,
            eventStartEditable: false,
            slotMinTime: '09:00:00',
            slotMaxTime: '21:00:00',
            allDaySlot: false,
            hiddenDays: [0],
            slotDuration: '00:30:00',
            selectLongPressDelay: 1,
            //slotHeight: 50,
            select: function (data) {
                ecamCalendarAdd(data);
            },
            eventClick: function(event) {
                ecamCalendarRemove(event);
            }
        });

and to add the event:

ec.addEvent({ 'id': data.id, 'start': data.fechainicial, 'end': data.fechafinal, 'title': 'Reserva ' + data.id + ' Online', 'resourceId': data.aul_id, 'color':color, 'editable': false, 'startEditable': false, 'durationEditable': false });

[vkurko]

I have prepared a demo where you can click on some time slot and an event with resourceId: 1 is added there. When you switch to resource view, the events are displayed. Can you reproduce the problem in this demo?

[churrezno]

Thanx again for your time @vkurko I´ve uploaded a video with the issue here. As you can see, I first add an event in the main view (semana) and it automatically gets added to the calendar and shows up in screen, but if I switch to the resources view (salas) it won´t show until I refresh the page. And in second place, when I add the event in the resources view, the event is created but it won´t show either, while if I switch back to the main view you can see it´s there... It´s kind of weird, I don´t understand it. Your demo works just fine (PS: don't mind the event colors, I have to fix something in the api that gets called)

https://github.com/vkurko/calendar/assets/150251546/77b9ea36-5215-457e-abb7-58dcaf876a4f

[vkurko]

I would double check that resourceId when adding a new event is correct.

[churrezno]

That was it! The api wasn't returning the right id. Thanx very much, it was driving me nuts ;)

[vkurko]

Great!