Calendar/Schedule

Dear Santa,
I believe a calendar/schedule plugin would be a great selling point for Wappler and a very good premium Extension for DMX Zone. Seems a lot of users require calendar and scheduling functionality in their applications and designs but are unsure how to implement such a feature… So therefore I am requesting your consideration and votes.

  • Responsive
  • Customisable
  • Static/Dynamic/remote events (db, Google Calendar and JSON)
  • ICAL compatible
  • Multilingual

A lot to ask I know. I just feel that such an offering would go down exceptionally well both commercially as an Extension and as a Wappler Pro feature.

I promise to be a good boy and not get in to any trouble and to eat all my greens…

Thank you.

Ho-Ho-Ho!

:smiley:

There was actually a DMX events calendar as a DW extension very back then. Actually now as I am writting this I remember I did create a page which was full of old school DMXzone tools and it actually still exists!

You can see the events calendar at the right (but it does not have any events assigned). You had the option to give several colors to the evens so it is easier to categorize them.

With a tear falling form my left eye I pass you the link
http://nrre.cperi.certh.gr/index.php?lang=en

3 Likes

Would be so nice to see an updated version of this Extension.

:slight_smile:

Maybe we can wait for server side API .btw we can use google calendar when it will be ready .
I was use to fullcalendar.io its working very well with wappler.

But of course included calendar extension idea is good :+1:

4 Likes

how does it integrate fullcallendar with wappler?

There is no direct integration built in to Wappler for Fullcalendar, as in there are no components (but it is well documented and StackOverflow is full of resources).

Hello @Dave , @alsdigital

you can use fullcalendar.io with wappler !!!

Simple Table Structure For Fullcalendar

then use ondone event on your server connect action

<dmx-serverconnect id="serverconnect1" url="dmxConnect/api/a/takvim.php" ondone="calendarStart()"></dmx-serverconnect>

 <script>
    function calendarStart() {
    var calendarEl = document.getElementById('calendar');
    var calendar = new FullCalendar.Calendar(calendarEl, {
      plugins: [ 'interaction', 'dayGrid' ],
      defaultDate: '2019-06-29',
      editable: true,
      eventLimit: true, // allow "more" link when too many events
      events: dmx.parse('serverconnect1.data.query1')
    });
    calendar.render();
    }
</script>

Result

4 Likes

If you want to use DATETIME field type in your database ;

 <script>
    function calendarStart() {
    var calendarEl = document.getElementById('calendar');
    var calendar = new FullCalendar.Calendar(calendarEl, {
      plugins: [ 'interaction', 'dayGrid' ],
      defaultDate: '2019-06-29',
      timeZone: 'local',
      editable: true,
      eventLimit: true, // allow "more" link when too many events
      events: dmx.parse('serverconnect1.data.query1')
    });
    calendar.render();
    }
</script>

Result

5 Likes

Hi, can you please do a video tutorial? Im not so good with code, and i really need this for a project. Thnks in advance.

hello @Max_Saravia, welcome to wappler
of course but I need to spare time . but this is really simple.
my first suggestion is read wappler documents if you dont read them .

I will create video tutorial end of this week. but you can try without video tuts. we are here and we can help to you always

1 Like

The basic implementation of Fullcalender is very simple but if you want to use features such as drag a date range to a new date range you will need to customise. Likewise for on hover, or click events, related to the events themselves. Basic insert, update, and delete can all be done outside of Fullcalender and inside of Wappler, but again if you wish to select a date range and add an event you will have to make some customisations. Likewise for clicking an event. You will have to pass the event id on click etc. All documented and not too difficult to do. Just a heads-up, so you don’t expect anything you were hoping for in that regard to work out of the box so to speak…

2 Likes