Hi.

I'm having issues returning the results to the calendar.

I get a popup with "there was an error while fetching events!"

In the console I get:

[Error] Failed to load resource: the server responded with a status of 404 () (null, line 0)
https://myproject.co.uk/api/christophheich/calendar/feed/null?start=2020-11-01T00%3A00%3A00Z&end=2020-12-13T00%3A00%3A00Z

One thing to note is I am in a sub-folder and the domain is not pointing to that, only the primary domain.

So the domain above should be :

https://myproject.co.uk/myfolder/api/christophheich/calendar/feed/null?start=2020-11-01T00%3A00%3A00Z&end=2020-12-13T00%3A00%3A00Z

One thing I tried, but haven't got access to the console is to add the sub-folder in the route to test, but I cant clear the cache with artisan to check if it works or not.

Many thanks

Last updated 4 years ago

Hey,

sorry for the late reply.

You can use a custom markup as found here https://octobercms.com/plugin/christophheich-calendar#documentation

Make sure to deactivate the default property of the component and add the following syntax below the component in your view eg.:

 {% component 'calendar' %}
        {% put scripts %}
        <script>
            document.addEventListener('DOMContentLoaded', function() {
                var calendarEl = document.getElementById('{{ calendar.alias }}');

                var calendar = new FullCalendar.Calendar(calendarEl, {
                    plugins: [ 'dayGrid', 'list', 'bootstrap' ],
                    header: {
                        left:   'today, prev, next',
                        center: 'title',
                        right:  'dayGridMonth, dayGridWeek, dayGridDay, list'
                    },
                    locale: '{{ calendar.property("language") }}',
                    events: {
                        url: document.location.origin + '/myfolder/api/christophheich/calendar/feed/{{ calendar.property("limit") }}',
                        method: 'GET',
                        failure: function() {
                            alert('there was an error while fetching events!');
                        }
                    },
                    eventClick: function(info) {
                        if (info.event.url) {
                            window.open(info.event.url);
                            return false;
                        }
                    },
                    eventRender: function(info) {
                        info.el.setAttribute('title', info.event.extendedProps.description);
                    },
                });

                calendar.render();
            });
        </script>
{% endput %}

Make sure to edit the /myfolder/ of the url.

Regards

Last updated 4 years ago

Thats not a problem, thank you for the reply.

I gave it a try earlier before posting, but, i think i have a caching issue on the browser so will try again tomorrow and report back.

Cheers