Construct a Creative Calendar Page

By Jennifer Neighbors, Senior Consultant*

Construct a Creative Calendar Page

By Jennifer Neighbors, Senior Consultant* 

Our database add-on product Calendar Plus is my new toy.  Ever since one of my coworkers introduced it to me, I’ve been having fun finding new ways to use it. And, while it wasn’t initially shown to me in this way, I’ve almost exclusively used my own take on a user interface for the calendar that I really like. To make things intuitive and super easy for users, I’ve been making pages like this one:

Instead of manually opening a “light box” on the calendar to add events, users simply need to fill out a form and press a button. The event will be posted on the calendar for them. Notice that a small copy of the calendar is embedded on the page where the user can instantly see the results of their work.

Like it? Here’s how to create it:

You’ll need to have administrative privileges for this. First, create your form with fields for calendar event details like the shown one above. Add a button and name it whatever you like. Create a hidden Yes/No field and name it “refreshCalendar”. Next, go to the Calendar Plus page and open the formula field that contains the calendar. Surprised? I, too, was floored to find out the entire calendar is contained in a standard Ninox formula field. It is! You may need to click once on the calendar’s border to expose the red square with a wrench symbol inside. Then you’ll see you can open this formula as you would with any formula field.

Using the copy to clipboard function, copy the entire formula inside the formula field. Next, back in the page you are building, add a blank formula field where you want the calendar to appear and copy the formula from your clipboard to that new formula field’s formula property. If you want to force the calendar to refresh every time you add to it, you’ll need to add a line of code to the formula near the end. Enter the new string of code just before these characters: </html>”). The string of code to add is:

<div style=’display:none;’>” + refreshCalendar + “</div>

Press OK to save your changes. Name the new formula field something like ‘Calendar 2’ and hide the field’s label. Resize this formula object to fit your form. Looking good, right?

Now you just need to add some code to your button. First, you’ll create variables to store your important field data. Then use them to post to the calendar. Your lines of code will look something like this:

do as server
     let xSDate := ‘Start Date’;
     let xEDate := ‘End Date’;
     let xDesc := Description;
     let xPart1 := ‘Participant One’;
     let xPart2 := ‘Participant Two’;
     let xTClr := ‘Text Color’;
     let xBClr := ‘Background Color’;
          (create ‘CALENDAR PLUS ENTRIES’).(
          ‘START DATE’ := date(xSDate);
          ‘END DATE’ := date(xEDate);
          PARTICIPANTS := xPart1 + “,” + xPart2;
          DESCRIPTION := xDesc;
          ‘BG COLOR’ := xBClr;
          ‘TEXT COLOR’ := xTClr
          );
     if refreshCalendar then
          refreshCalendar := false
     else
          refreshCalendar := true
     end
end

What I am doing here is posting a record to the hidden table named “Calendar Plus Entries”. This table’s records populate the calendar, so by adding a record I can post a new event to the calendar. To delete a calendar entry, all I need to do is delete the record from this hidden table. And so forth. It’s a regular table and can be treated like any other Ninox table. Because I am using the cloud version of Ninox, I’m doing the whole thing on the server to speed it up.

To wrap up my code block, I might delete the values in the form so the user can start again, and then let the user know it’s been done:

‘Start Date’ := null;
‘End Date’ := null;
…etc.
Alert(“Your event has been posted to the calendar!”)

I like this form approach to calendar entries; it’s particularly useful for teams where most users won’t want to learn all the many (albeit wonderful) functions of the calendar but, instead, just need to post their event in a simple, easy, and fast way.


Here’s an interesting variation:

What I’ve done here is design the form to create a sequence of events that occur periodically for a user-defined number of times. To do that, add a number field to your form and invite users to “repeat” their event the number of times they enter. Then, using looping code and date formulas, enter the event multiple times to the calendar. This is useful for a series of meetings, for example, where the day, time, and attendees will be the same each time.

Try Calendar Plus yourself and you’ll soon be playing with this cool toy, too. For more information, check out our Calendar Plus web page at https://nioxus.com/products/calendar-plus/.

*Grateful appreciation goes to Adam Davidson, Senior Programmer, for technical help with this article.

en_USEN