KanbanModel API in JavaScript (ES5) Kanban API control

Interface for a class Kanban

Properties

actionBegin

EmitType<ActionEventArgs>

Triggers on beginning of every Kanban action.

actionComplete

EmitType<ActionEventArgs>

Triggers on successful completion of the Kanban actions.

actionFailure

EmitType<ActionEventArgs>

Triggers when a Kanban action gets failed or interrupted and an error information will be returned.

cardClick

EmitType<CardClickEventArgs>

Triggers on single-clicking the Kanban cards.

cardDoubleClick

EmitType<CardClickEventArgs>

Triggers on double-clicking the Kanban cards.

cardRendered

EmitType<CardRenderedEventArgs>

Triggers before each card of the Kanban rendering on the page.

created

EmitType<Record>

Triggers after the kanban component is created.

dataBinding

EmitType<ReturnType>

Triggers before the data binds to the Kanban.

dataBound

EmitType<ReturnType>

Triggers once the event data is bound to the Kanban.

dataSourceChanged

EmitType<DataSourceChangedEventArgs>

Triggers when the grid data is added, deleted and updated. Invoke the done method from the argument to start render after edit operation.

dataStateChange

EmitType<DataStateChangeEventArgs>

Triggers when the grid actions such as Sorting, Paging, Grouping etc., are done. In this event,the current view data and total record count should be assigned to the dataSource based on the action performed.

dialogClose

EmitType<DialogEventArgs>

Triggers before the dialog closes.

dialogOpen

EmitType<DialogEventArgs>

Triggers before the dialog opens.

drag

EmitType<DragEventArgs>

Triggers when the card is dragging to other stage or other swimlane.

dragStart

EmitType<DragEventArgs>

Triggers when the card drag actions starts.

dragStop

EmitType<DragEventArgs>

Triggers when the card drag actions stops.

queryCellInfo

EmitType<QueryCellInfoEventArgs>

Triggers before each column of the Kanban rendering on the page.

allowDragAndDrop

boolean

Enables or disables the drag and drop actions in Kanban.

allowKeyboard

boolean

When this property is set to true, it allows the keyboard interaction in Kanban.

cardSettings

CardSettingsModel

Defines the Kanban board related settings such as header field, content field, template, show or hide header, and single or multiple selection.

columns

ColumnsModel[]

Defines the Kanban board columns and their properties such as header text, key field, template, allow toggle, expand or collapse state, min or max count, and show or hide item count.

constraintType

ConstraintType

Defines the constraint type used to apply validation based on column or swimlane. The possible values are:

• Column
• Swimlane

cssClass

string

It is used to customize the Kanban, which accepts custom CSS class names that defines specific user-defined styles and themes to be applied on the Kanban element.

dataSource

Record[] | DataManager

With this property, the card data will be bound to Kanban. The card data can be passed either as an array of JavaScript objects, or else can create an instance of DataManager in case of processing remote data and can be assigned to the dataSource property. With the remote data assigned to dataSource, check the available adaptors to customize the data processing.

dialogSettings

DialogSettingsModel

Defines the dialog settings such as template and fields.

enableHtmlSanitizer

boolean

Determine whether to prevent cross-site scripting code in Kanban data entry fields.

enablePersistence

boolean

Enables or disables the persisting component’s state between page reloads. If enabled, columns, dataSource properties will be persisted in kanban.

enableRtl

boolean

Enable or disable rendering component in right to left direction.

enableTooltip

boolean

Enables or disables the tooltip in Kanban board. The property relates to the tooltipTemplate property.

externalDropId

string[]

Defines the ID of drop component on which drop should occur.

height

string | number

Sets the height of the Kanban component, accepting both string and number values. The string type includes either pixel or percentage values. When height is set with specific pixel value, then the Kanban will be rendered to that specified space. In case, if auto value is set, then the height of the Kanban gets auto-adjusted within the given container.

keyField

string

Defines the key field of Kanban board. The Kanban renders its layout based on this key field.

locale

string

Overrides the global culture and localization value for this component. Default global culture is ‘en-US’.

query

Query

Defines the external query that will be executed along with the data processing.

showEmptyColumn

boolean

Enable or disable the columns when empty dataSource.

sortSettings

SortSettingsModel

Defines the sort settings such as field and direction.

stackedHeaders

StackedHeadersModel[]

Defines the stacked header for Kanban columns with text and key fields.

swimlaneSettings

SwimlaneSettingsModel

Defines the swimlane settings to Kanban board such as key field, text field, template, allow drag-and-drop, show or hide empty row, show or hide items count, and more.

tooltipTemplate

string

Defines the template content to card’s tooltip. The property works by enabling the ‘enableTooltip’ property.

width

string | number

Sets the width of the Kanban component, accepting both string and number values. The string value can be either pixel or percentage format. When set to auto, the Kanban width gets auto-adjusted and display its content related to the viewable screen size.