New to Telerik UI for JSP? Download free 30-day trial

<kendo:taskBoard>

A JSP wrapper for Kendo UI TaskBoard.

Configuration Attributes

autoBind boolean

Controls whether to bind the TaskBoard to the data source on initialization.

Example

<kendo:taskBoard autoBind="autoBind">
</kendo:taskBoard>

columns java.lang.Object

Sets the DataSource for the Columns of the TaskBoard. Can be bound to a remote service or local data.

Example

<kendo:taskBoard columns="columns">
</kendo:taskBoard>

dataCategoryField java.lang.String

The category field of the card.

Example

<kendo:taskBoard dataCategoryField="dataCategoryField">
</kendo:taskBoard>

dataDescriptionField java.lang.String

The description field of the card.

Example

<kendo:taskBoard dataDescriptionField="dataDescriptionField">
</kendo:taskBoard>

dataOrderField java.lang.String

The field used to order cards (number based). If not set, cards will be rendered in the order they are fetched. And ordering will not be applied to the DataSource and respectively, not synced with the remote data source.

Example

<kendo:taskBoard dataOrderField="dataOrderField">
</kendo:taskBoard>

dataStatusField java.lang.String

The field of the data item that provides the status of the card. Mapped with the status of the columns.

Example

<kendo:taskBoard dataStatusField="dataStatusField">
</kendo:taskBoard>

dataTitleField java.lang.String

The title field of the card.

Example

<kendo:taskBoard dataTitleField="dataTitleField">
</kendo:taskBoard>

editable boolean

Toggles the editing in the TaskBoard. Both for columns and cards. Further configuration is available via kendo:taskBoard-editable.

Example

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

height java.lang.Object

Configures the height of the TaskBoard wrapper.

Example

<kendo:taskBoard height="height">
</kendo:taskBoard>

previewPane boolean

Toggles the previewPane in the TaskBoard. Further configuration is available via kendo:taskBoard-previewPane.

Example

<kendo:taskBoard previewPane="previewPane">
</kendo:taskBoard>

reorderable boolean

Toggles the reordering of cards in the TaskBoard.

Example

<kendo:taskBoard reorderable="reorderable">
</kendo:taskBoard>

selectable boolean

Toggles the selection of the TaskBoard.

Example

<kendo:taskBoard selectable="selectable">
</kendo:taskBoard>

template java.lang.String

Controls the rendering of the card.

Example

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

toolbar boolean

Configures the Tools of the TaskBoard Further configuration is available via kendo:taskBoard-toolbar.

Example

<kendo:taskBoard toolbar="toolbar">
</kendo:taskBoard>

width java.lang.Object

Configures the width of the TaskBoard wrapper.

Example

<kendo:taskBoard width="width">
</kendo:taskBoard>

Configuration JSP Tags

kendo:taskBoard-cardMenu

Defines the list of buttons rendered in the card.

More documentation is available at kendo:taskBoard-cardMenu.

Example

<kendo:taskBoard>
    <kendo:taskBoard-cardMenu></kendo:taskBoard-cardMenu>
</kendo:taskBoard>

kendo:taskBoard-columnSettings

Defines the settings for the columns.

More documentation is available at kendo:taskBoard-columnSettings.

Example

<kendo:taskBoard>
    <kendo:taskBoard-columnSettings></kendo:taskBoard-columnSettings>
</kendo:taskBoard>

kendo:taskBoard-editable

Toggles the editing in the TaskBoard. Both for columns and cards.

More documentation is available at kendo:taskBoard-editable.

Example

<kendo:taskBoard>
    <kendo:taskBoard-editable></kendo:taskBoard-editable>
</kendo:taskBoard>

kendo:taskBoard-messages

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

More documentation is available at kendo:taskBoard-messages.

Example

<kendo:taskBoard>
    <kendo:taskBoard-messages></kendo:taskBoard-messages>
</kendo:taskBoard>

kendo:taskBoard-previewPane

Toggles the previewPane in the TaskBoard.

More documentation is available at kendo:taskBoard-previewPane.

Example

<kendo:taskBoard>
    <kendo:taskBoard-previewPane></kendo:taskBoard-previewPane>
</kendo:taskBoard>

kendo:taskBoard-resources

The configuration of the TaskBoard resource(s). A TaskBoard resource is optional metadata that can be associated with a TaskBoard event.

More documentation is available at kendo:taskBoard-resources.

Example

<kendo:taskBoard>
    <kendo:taskBoard-resources></kendo:taskBoard-resources>
</kendo:taskBoard>

kendo:taskBoard-toolbar

Configures the Tools of the TaskBoard

More documentation is available at kendo:taskBoard-toolbar.

Example

<kendo:taskBoard>
    <kendo:taskBoard-toolbar></kendo:taskBoard-toolbar>
</kendo:taskBoard>

Event Attributes

columnsDataBinding String

Fired before the TaskBoard binds the columns' data source.

For additional information check the columnsDataBinding event documentation.

Example

<kendo:taskBoard columnsDataBinding="handle_columnsDataBinding">
</kendo:taskBoard>
<script>
    function handle_columnsDataBinding(e) {
        // Code to handle the columnsDataBinding event.
    }
</script>

columnsDataBound String

Fired when the TaskBoard's columns are bound to their data source.

For additional information check the columnsDataBound event documentation.

Example

<kendo:taskBoard columnsDataBound="handle_columnsDataBound">
</kendo:taskBoard>
<script>
    function handle_columnsDataBound(e) {
        // Code to handle the columnsDataBound event.
    }
</script>

select String

Fired when the user selects a card in the TaskBoard.

For additional information check the select event documentation.

Example

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

dataBinding String

Fired before the TaskBoard binds to its data source.

For additional information check the dataBinding event documentation.

Example

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

dataBound String

Fired when the TaskBoard is bound to data from its data source.

For additional information check the dataBound event documentation.

Example

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

deleteCard String

Fired when the user deletes a card.

For additional information check the deleteCard event documentation.

Example

<kendo:taskBoard deleteCard="handle_deleteCard">
</kendo:taskBoard>
<script>
    function handle_deleteCard(e) {
        // Code to handle the deleteCard event.
    }
</script>

deleteColumn String

Fired when the user deletes a column.

For additional information check the deleteColumn event documentation.

Example

<kendo:taskBoard deleteColumn="handle_deleteColumn">
</kendo:taskBoard>
<script>
    function handle_deleteColumn(e) {
        // Code to handle the deleteColumn event.
    }
</script>

editCard String

Fired when the user edits or creates a card.

For additional information check the editCard event documentation.

Example

<kendo:taskBoard editCard="handle_editCard">
</kendo:taskBoard>
<script>
    function handle_editCard(e) {
        // Code to handle the editCard event.
    }
</script>

editColumn String

Fired when the user edits or creates a column.

For additional information check the editColumn event documentation.

Example

<kendo:taskBoard editColumn="handle_editColumn">
</kendo:taskBoard>
<script>
    function handle_editColumn(e) {
        // Code to handle the editColumn event.
    }
</script>

execute String

Fires when a command is executed.

For additional information check the execute event documentation.

Example

<kendo:taskBoard execute="handle_execute">
</kendo:taskBoard>
<script>
    function handle_execute(e) {
        // Code to handle the execute event.
    }
</script>

move String

Fired when the user moves a card.

For additional information check the move event documentation.

Example

<kendo:taskBoard move="handle_move">
</kendo:taskBoard>
<script>
    function handle_move(e) {
        // Code to handle the move event.
    }
</script>

moveEnd String

Fired when the user dropped a card in a column.

For additional information check the moveEnd event documentation.

Example

<kendo:taskBoard moveEnd="handle_moveEnd">
</kendo:taskBoard>
<script>
    function handle_moveEnd(e) {
        // Code to handle the moveEnd event.
    }
</script>

moveStart String

Fired when the user started moving a card.

For additional information check the moveStart event documentation.

Example

<kendo:taskBoard moveStart="handle_moveStart">
</kendo:taskBoard>
<script>
    function handle_moveStart(e) {
        // Code to handle the moveStart event.
    }
</script>

change String

Fired when the user changed the card order or status by dragging.

For additional information check the change event documentation.

Example

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

saveCard String

Fired when the user saves a card.

For additional information check the saveCard event documentation.

Example

<kendo:taskBoard saveCard="handle_saveCard">
</kendo:taskBoard>
<script>
    function handle_saveCard(e) {
        // Code to handle the saveCard event.
    }
</script>

saveColumn String

Fired when the user saves a column.

For additional information check the saveColumn event documentation.

Example

<kendo:taskBoard saveColumn="handle_saveColumn">
</kendo:taskBoard>
<script>
    function handle_saveColumn(e) {
        // Code to handle the saveColumn event.
    }
</script>

Event Tags

kendo:taskBoard-columnsDataBinding

Fired before the TaskBoard binds the columns' data source.

For additional information check the columnsDataBinding event documentation.

Example

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

kendo:taskBoard-columnsDataBound

Fired when the TaskBoard's columns are bound to their data source.

For additional information check the columnsDataBound event documentation.

Example

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

kendo:taskBoard-select

Fired when the user selects a card in the TaskBoard.

For additional information check the select event documentation.

Example

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

kendo:taskBoard-dataBinding

Fired before the TaskBoard binds to its data source.

For additional information check the dataBinding event documentation.

Example

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

kendo:taskBoard-dataBound

Fired when the TaskBoard is bound to data from its data source.

For additional information check the dataBound event documentation.

Example

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

kendo:taskBoard-deleteCard

Fired when the user deletes a card.

For additional information check the deleteCard event documentation.

Example

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

kendo:taskBoard-deleteColumn

Fired when the user deletes a column.

For additional information check the deleteColumn event documentation.

Example

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

kendo:taskBoard-editCard

Fired when the user edits or creates a card.

For additional information check the editCard event documentation.

Example

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

kendo:taskBoard-editColumn

Fired when the user edits or creates a column.

For additional information check the editColumn event documentation.

Example

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

kendo:taskBoard-execute

Fires when a command is executed.

For additional information check the execute event documentation.

Example

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

kendo:taskBoard-move

Fired when the user moves a card.

For additional information check the move event documentation.

Example

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

kendo:taskBoard-moveEnd

Fired when the user dropped a card in a column.

For additional information check the moveEnd event documentation.

Example

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

kendo:taskBoard-moveStart

Fired when the user started moving a card.

For additional information check the moveStart event documentation.

Example

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

kendo:taskBoard-change

Fired when the user changed the card order or status by dragging.

For additional information check the change event documentation.

Example

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

kendo:taskBoard-saveCard

Fired when the user saves a card.

For additional information check the saveCard event documentation.

Example

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

kendo:taskBoard-saveColumn

Fired when the user saves a column.

For additional information check the saveColumn event documentation.

Example

<kendo:taskBoard>
    <kendo:taskBoard-saveColumn>
        <script>
            function(e) {
                // Code to handle the saveColumn event.
            }
        </script>
    </kendo:taskBoard-saveColumn>
</kendo:taskBoard>
In this article
Not finding the help you need?