DataView API overview
Methods
Name | Description |
---|---|
destructor() | removes DataView instance and releases occupied resources |
editItem() | enables editing of an item |
getFocus() | returns the id of an item in focus |
getFocusItem() | returns the object of an item in focus |
paint() | repaints a dataview on a page |
setFocus() | sets focus to an item by its id |
important
- Use the methods of DataCollection to work with data.
- Apply the methods of Selection to manage the selection of DataView items.
Events
Name | Description |
---|---|
afterDrag | fires after dragging of an item is finished |
afterDrop | fires before the user has finished dragging an item but after the mouse button is released |
afterEditEnd | fires after editing of an item is ended |
afterEditStart | fires after editing of an item has started |
beforeDrag | fires before dragging of an item has started |
beforeDrop | fires before the user has finished dragging an item and released the mouse button |
beforeEditEnd | fires before editing of an item is completed |
beforeEditStart | fires before editing of an item has started |
cancelDrop | fires on moving a mouse pointer out of item's borders while dragging the item |
canDrop | fires when a dragged item is over a target item |
click | fires on clicking an item |
doubleClick | fires on double clicking an item |
dragIn | fires when an item is dragged to another potential target |
dragOut | fires when an item is dragged out of a potential target |
dragStart | fires when dragging of an item has started |
focusChange | fires on moving focus to a new item |
itemMouseOver | fires on moving the mouse pointer over an item |
itemRightClick | fires on right clicking an item |
important
- Use the events of DataCollection to work with data of DataView.
- Apply the events of Selection to control the selection of DataView items.
Properties
Name | Description |
---|---|
css | adds a CSS class(es) to the component |
data | specifies an array of data objects to set into the dataview |
dragCopy | defines that an item is copied to a target during drag-n-drop |
dragMode | enables drag-n-drop in DataView |
editable | enables editing in DataView |
eventHandlers | adds event handlers to the HTML elements of a custom template of DataView items |
gap | sets margins for DataView items |
height | sets the height of DataView |
itemHeight | sets the height of an item |
itemsInRow | specifies the number of data items in a row |
keyNavigation | enables/disables navigation in DataView by arrow keys |
multiselection | enables selection of multiple DataView items, sets the mode of multiselection |
selection | enables selection of DataView items |
template | specifies a template for DataView items |