Click Handlers

Description

A click handler defined in the data source configuration will enable a click handler on all events for this data source.  Kinetic Schedule will execute the defined click handler instructions instead of retrieving and displaying the event details in a dialog window.

A click handler defined in the calendar configuaration will enable a click handler for view container.  This will allow Kinetic Schedule to execute a javascript function or open a URL when the user clicks in any open time slot in the schedule view.

A click handler defined in the resource confiruation will enable a click handler on all resource rows.  This allows Kinetic Schedule to execute a javascript function or open a URL when the user clicks on a cell with a resource name.  The javascript function or URL could contain code that looks up details about this resource and displays that information to the user.

Any number of parameters may be defined to send additional information to the javascript function or URL.

Types of Click Handlers

A click handler can be defined as either a URL click handler, or a Javascript click handler.  A URL click handler opens the web browser to a URL, and a Javascript click handler runs a pre-defined javascript function.

Please see the URL Click Handler page or the Javascript Click Handler page for details about the different click handlers.

Click Handler Configuration

The configuration properties for click handlers vary depending on what type of object the click handler is associated with (calendar, resource, data source).  But the basic configuration properties that all click handlers share is as follows:

"clickHandler": {
    "type": "typeValue - Either js or url",
    "callback": "callbackValue - js function or url",
    "target": "targetValue - ** URL click handler ONLY - either _blank or _self",
    ​"showDialogFirst": "false",
    ​"startTimeParameter": "startTime",
    "parameters": [
    ​    {
            "name1": "parameterName1",
            "value": "staticValue1"
        },
        ​{
        ​    "name2": "parameterName2",
        ​    "value": "{{dynamicValue2}}"
        ​}
    ]
        ​
}

"duration": 60

"parameterName1": "{{propertyName}}"

"parameterName1": "Mixed value - {{propertyName}}"

Event Properties

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

Resource Properties

The resource properties that are available to use consist of the resource key and value fields, and any filter mappings that have been configured on the resource.

Calendar Properties

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

An example click handler 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 click handler 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",
    ​"target": "_blank",
    ​"showDialogFirst": "false",
    ​"startTimeParameter": "startTime",
    "parameters": [
    ​    {
    ​        "name": "resourceId",
    ​        "value": "{{sourceMapKey}}"
    ​    },

​        {
​            "name": "eventType",
           ​ "value": "{{sourceMapDatasourceValuesKeyId}}"
       ​ },
       ​ {
           ​ "name": "duration",
           ​ "value": "60"
       ​ }
    ]
}

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

• resourceId
• eventType
• duration

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.