Click Handlers

URL click handler or Javascript click handler

Types of Click Handlers

A click handler can be defined as either a URL click handler, or a Javascript click handler. This is defined by setting the click handler 'type' property to the desired value: "url" or "js".

Event Properties

The event properties that are available to use consist of the core event fields, and any event filter mappings that have been configured on the event type.

Property Name	Description
calendarId	The unique ID of the calendar this event belongs to
calendarName	The name of the calendar this event belongs to
typeId	The name of the event type this event belongs to
id	The unique event ID
name	The event name
description	The event description
start	The date/time the event starts, relative to the user's time zone
end	The date/time the event ends, relative to the use's time zone
startGMT	The date/time the event starts, relative to GMT
endGMT	The date/time the event ends, relative to GMT
allDay	Indicates if the event is an all day event or not - true if all day, false if not all day
filterFields['Name of Filter']	A filter mapping field defined in the event type configuration. The name in the square bracket must match the name property of the filter mapping.

Calendar Properties

This is a list of the calendar properties that are available to use in the calendar clickhandler parameters.

Property Name	Description
name	The calendar name
id	The unique calendar Id
description	The calendar description
status	The calendar status - Active or Inactive
defaultView	The default view used when rendering the calendar - Day, Week, Month, or List
displayPage	The display page used when rendering the calendar
fixedTimezone	The name of the timezone this calendar uses to display all events, if this calendar uses one
clickedDate	The date of the point where the user clicked the open calendar time slot (yyyyMMdd)
clickedTime	The time of the point where the user clicked the open calendar time slot (HH:mm)
clickedDateTime	The date/time of the point where the user clicked the open calendar time slot (yyyyMMddTHH:mm)
clickedTimeZone	The time zone id that was used when the user clicked the open calendar time slot (Olson Timezone ID, so America/Chicago as an example)

An example clickhandler from a calendar configuration file. In this example, an object that contains eight parameters will be sent to the KD.calendar.Theme.exampleShowParameters javascript function. If the clickhandler was a URL type of handler, the parameters would be evaluated and sent on the URL as query string parameters.

"clickHandler": {
    "type": "js",
    "callback": "KD.calendar.Theme.exampleShowParameters",
    "parameters": {
        "startDate": "{{clickedDate}}",
        "startTime": "{{clickedTime}}",
        "startDateTime": "{{clickedDateTime}}",
        "timezone": "{{clickedTimeZone}}",
        "duration": 60,
        "calName": "{{name}}",
        "calId": "{{id}}",
        "calDesc": "{{description}}"
    }
}

The parameters can be named anything, but in this example they are named:

startDate
startTime
startDateTime
timezone
duration
calName
calId
calDesc

These parameters can be used in the callback handler for any purpose. The example javascript function just displays an alert message that shows the parameter names and values.

Updated over 2 years ago