<kendo:orgChart>

A JSP wrapper for Kendo UI OrgChart.

Configuration Attributes

cardsColors java.lang.Object

An array of strings defining the cards top-border color for each level starting from the top level. If not set, the colors from the Kendo Chart series will be used.

Example

<kendo:orgChart cardsColors="cardsColors">
</kendo:orgChart>

editable boolean

If set to false, the user will not be able to edit the data to which the OrgChart is bound. By default, editing is enabled.The editable option can also be set to a JavaScript object (which represents the editing configuration). Further configuration is available via kendo:orgChart-editable.

Example

<kendo:orgChart editable="editable">
</kendo:orgChart>

groupField java.lang.String

Specifies the field the nodes should be grouped by. If any value is passed, the OrgChart uses its grouping rendering mode.

Example

<kendo:orgChart groupField="groupField">
</kendo:orgChart>

groupHeaderTemplate java.lang.String

Provides an option to customize the default template for the group label (using the field value and name by default).

Example

<kendo:orgChart groupHeaderTemplate="groupHeaderTemplate">
</kendo:orgChart>

template java.lang.String

Defines a node card template.

Example

<kendo:orgChart template="template">
</kendo:orgChart>

Configuration JSP Tags

kendo:orgChart-editable

If set to false, the user will not be able to edit the data to which the OrgChart is bound. By default, editing is enabled.The editable option can also be set to a JavaScript object (which represents the editing configuration).

More documentation is available at kendo:orgChart-editable.

Example

<kendo:orgChart>
    <kendo:orgChart-editable></kendo:orgChart-editable>
</kendo:orgChart>

kendo:orgChart-messages

Provides configuration options for the messages present in the OrgChart widget.

More documentation is available at kendo:orgChart-messages.

Example

<kendo:orgChart>
    <kendo:orgChart-messages></kendo:orgChart-messages>
</kendo:orgChart>

Event Attributes

cancel String

Triggered when the user is about to cancel the changes for the currently edited node. Preventable.

For additional information check the cancel event documentation.

Example

<kendo:orgChart cancel="handle_cancel">
</kendo:orgChart>
<script>
    function handle_cancel(e) {
        // Code to handle the cancel event.
    }
</script>

change String

Triggered when the selected node has been changed upon user interaction.

For additional information check the change event documentation.

Example

<kendo:orgChart change="handle_change">
</kendo:orgChart>
<script>
    function handle_change(e) {
        // Code to handle the change event.
    }
</script>

collapse String

Triggered before a node has been collapsed upon user interaction. Preventable.

For additional information check the collapse event documentation.

Example

<kendo:orgChart collapse="handle_collapse">
</kendo:orgChart>
<script>
    function handle_collapse(e) {
        // Code to handle the collapse event.
    }
</script>

create String

Triggered when a node is about to be created upon user interaction. Preventable.

For additional information check the create event documentation.

Example

<kendo:orgChart create="handle_create">
</kendo:orgChart>
<script>
    function handle_create(e) {
        // Code to handle the create event.
    }
</script>

dataBinding String

Triggered before the actual change in the dataSource occurs. Preventable.

For additional information check the dataBinding event documentation.

Example

<kendo:orgChart dataBinding="handle_dataBinding">
</kendo:orgChart>
<script>
    function handle_dataBinding(e) {
        // Code to handle the dataBinding event.
    }
</script>

dataBound String

Triggered after the dataSource change event has been processed (adding/removing/loading/editing items).

For additional information check the dataBound event documentation.

Example

<kendo:orgChart dataBound="handle_dataBound">
</kendo:orgChart>
<script>
    function handle_dataBound(e) {
        // Code to handle the dataBound event.
    }
</script>

delete String

Triggered when a node is about to be deleted as of a consequence of user interaction. Preventable.

For additional information check the delete event documentation.

Example

<kendo:orgChart delete="handle_delete">
</kendo:orgChart>
<script>
    function handle_delete(e) {
        // Code to handle the delete event.
    }
</script>

edit String

Triggered when a node is about to enter edit mode upon user interaction. Preventable.

For additional information check the edit event documentation.

Example

<kendo:orgChart edit="handle_edit">
</kendo:orgChart>
<script>
    function handle_edit(e) {
        // Code to handle the edit event.
    }
</script>

expand String

Triggered before a node has been expanded upon user interaction. Preventable.

For additional information check the expand event documentation.

Example

<kendo:orgChart expand="handle_expand">
</kendo:orgChart>
<script>
    function handle_expand(e) {
        // Code to handle the expand event.
    }
</script>

save String

Triggered when the user attempts to save the current changes on the edited node. Preventable.

For additional information check the save event documentation.

Example

<kendo:orgChart save="handle_save">
</kendo:orgChart>
<script>
    function handle_save(e) {
        // Code to handle the save event.
    }
</script>

select String

Triggered when the user attempts to select a new node or group of nodes (in grouped scenario). Preventable.

For additional information check the select event documentation.

Example

<kendo:orgChart select="handle_select">
</kendo:orgChart>
<script>
    function handle_select(e) {
        // Code to handle the select event.
    }
</script>

Event Tags

kendo:orgChart-cancel

Triggered when the user is about to cancel the changes for the currently edited node. Preventable.

For additional information check the cancel event documentation.

Example

<kendo:orgChart>
    <kendo:orgChart-cancel>
        <script>
            function(e) {
                // Code to handle the cancel event.
            }
        </script>
    </kendo:orgChart-cancel>
</kendo:orgChart>

kendo:orgChart-change

Triggered when the selected node has been changed upon user interaction.

For additional information check the change event documentation.

Example

<kendo:orgChart>
    <kendo:orgChart-change>
        <script>
            function(e) {
                // Code to handle the change event.
            }
        </script>
    </kendo:orgChart-change>
</kendo:orgChart>

kendo:orgChart-collapse

Triggered before a node has been collapsed upon user interaction. Preventable.

For additional information check the collapse event documentation.

Example

<kendo:orgChart>
    <kendo:orgChart-collapse>
        <script>
            function(e) {
                // Code to handle the collapse event.
            }
        </script>
    </kendo:orgChart-collapse>
</kendo:orgChart>

kendo:orgChart-create

Triggered when a node is about to be created upon user interaction. Preventable.

For additional information check the create event documentation.

Example

<kendo:orgChart>
    <kendo:orgChart-create>
        <script>
            function(e) {
                // Code to handle the create event.
            }
        </script>
    </kendo:orgChart-create>
</kendo:orgChart>

kendo:orgChart-dataBinding

Triggered before the actual change in the dataSource occurs. Preventable.

For additional information check the dataBinding event documentation.

Example

<kendo:orgChart>
    <kendo:orgChart-dataBinding>
        <script>
            function(e) {
                // Code to handle the dataBinding event.
            }
        </script>
    </kendo:orgChart-dataBinding>
</kendo:orgChart>

kendo:orgChart-dataBound

Triggered after the dataSource change event has been processed (adding/removing/loading/editing items).

For additional information check the dataBound event documentation.

Example

<kendo:orgChart>
    <kendo:orgChart-dataBound>
        <script>
            function(e) {
                // Code to handle the dataBound event.
            }
        </script>
    </kendo:orgChart-dataBound>
</kendo:orgChart>

kendo:orgChart-delete

Triggered when a node is about to be deleted as of a consequence of user interaction. Preventable.

For additional information check the delete event documentation.

Example

<kendo:orgChart>
    <kendo:orgChart-delete>
        <script>
            function(e) {
                // Code to handle the delete event.
            }
        </script>
    </kendo:orgChart-delete>
</kendo:orgChart>

kendo:orgChart-edit

Triggered when a node is about to enter edit mode upon user interaction. Preventable.

For additional information check the edit event documentation.

Example

<kendo:orgChart>
    <kendo:orgChart-edit>
        <script>
            function(e) {
                // Code to handle the edit event.
            }
        </script>
    </kendo:orgChart-edit>
</kendo:orgChart>

kendo:orgChart-expand

Triggered before a node has been expanded upon user interaction. Preventable.

For additional information check the expand event documentation.

Example

<kendo:orgChart>
    <kendo:orgChart-expand>
        <script>
            function(e) {
                // Code to handle the expand event.
            }
        </script>
    </kendo:orgChart-expand>
</kendo:orgChart>

kendo:orgChart-save

Triggered when the user attempts to save the current changes on the edited node. Preventable.

For additional information check the save event documentation.

Example

<kendo:orgChart>
    <kendo:orgChart-save>
        <script>
            function(e) {
                // Code to handle the save event.
            }
        </script>
    </kendo:orgChart-save>
</kendo:orgChart>

kendo:orgChart-select

Triggered when the user attempts to select a new node or group of nodes (in grouped scenario). Preventable.

For additional information check the select event documentation.

Example

<kendo:orgChart>
    <kendo:orgChart-select>
        <script>
            function(e) {
                // Code to handle the select event.
            }
        </script>
    </kendo:orgChart-select>
</kendo:orgChart>