A control for presenting tree in a grid cell.
The component is used to integrate a tree into an editable grid. There is a support for in-line node editing, drag-and-drop, filtering, checkboxes etc. Check treetable documentation for more detailed description.
add | adds an item to the store |
addCellCss | adds a css class to the cell |
addCss | applied CSS class to a component item |
addRowCss | adds a css class to the row |
addSelectArea | adds a select area |
addSpan | adds a colspan or a rowspan to the datatable |
adjust | adjusts the component to the size of the parent HTML container |
adjustColumn | adjusts a column to the width of the content |
adjustRowHeight | adjusts row height to cell content |
attachEvent | attaches the handler to an inner event of the component |
bind | binds components |
blockEvent | temporarily blocks triggering of ALL events of the calling object |
callEvent | calls an inner event |
checkAll | check all items in tree |
checkItem | checks the checkbox it the tree item |
clearAll | removes all items from the component |
clearCss | removes CSS class from all items |
clearSelection | clears selection |
clearValidation | removes all validation marks from the component |
close | closes the branch with the specified id |
closeAll | closes all branches in the tree |
closeSub | closes a subrow or a subview for an item with the given id |
collectValues | returns an array of unique values of the specified column |
columnId | returns the id of the column at the specified index |
copy | copies an item to the same or another object |
count | returns the number of currently visible items |
define | redefines a single configuration property (or a object with properties) |
destructor | destructs the calling object |
detachEvent | detaches a handler from an event (which was attached before by the attachEvent method) |
disable | disables the calling view (makes it dimmed and unclickable) |
eachColumn | iterates over all visible columns in the table |
eachRow | iterates over all rows in the table |
edit | enables the edit mode for the specified item |
editCancel | cancels the edit mode and closes all opened editors. The component remains editable. |
editCell | enables the edit mode for the specified cell |
editColumn | enables the edit mode for the specified column |
editNext | closes the current editor and opens one in the next cell of the row |
editRow | enables the edit mode for the specified row |
editStop | stops the edit mode and closes all opened editors. The component remains editable. |
enable | enables the calling view that was disabled by the 'disable' method |
exists | checks whether an item with the specified ID exists |
filter | filters the component |
filterByAll | refilters DataTable by all specified filters |
find | returns all rows that match the criterion, or only the first one |
focusEditor | moves focus to the active editor |
getAllSelectAreas | returns an object that contains configuration objects of all select areas in the datatable |
getBranchIndex | gets index of the node in a specific branch |
getChecked | returns ids of the checked items |
getChildViews | returns child views of the calling component |
getColumnConfig | returns the configuration object of the specified column |
getColumnIndex | returns the index of the column with the specified id |
getColumns | returns an array of columns |
getCss | returns the className of a cell |
getEditState | returns info about active editor object |
getEditor | returns an editor object |
getEditorValue | returns the value of the active (currently open) editor |
getFilter | returns the filter object that is used to filter the values of the specified column |
getFirstChildId | gets the ID of the first child of the specified branch |
getFirstId | returns the ID of the first item |
getFooterNode | returns an HTML element of the column footer |
getFormView | returns master form for the input |
getHeaderContent | returns a set of helpers for header content manipulation |
getHeaderNode | returns an HTML element of the column header |
getIdByIndex | returns the ID of the item with the specified index |
getIndexById | returns the index of the item with the specified ID |
getItem | gets the object of the data item with the specified ID |
getItemNode | returns HTML element of the item |
getLastId | returns the ID of the last item |
getNextId | returns the ID of an item that is after the specified item, either directly after or after a number of items (defined by the step) |
getNextSiblingId | returns the ID of the next sibling of the specified node |
getNode | returns the main HTML container for the calling object |
getOpenItems | returns ids of the opened branches |
getPage | returns the currently visible page in case of paged view |
getPager | returns the pager object associated with the component |
getParentId | get the ID of the parent node of the specified item |
getParentView | returns the parent view of the component |
getPrevId | returns the ID of an item that is before the specified item, either directly before or before a number of items (defined by the step) |
getPrevSiblingId | returns the id of the previous sibling of the specified node |
getScrollState | returns the current position of scrolls |
getSelectArea | returns the object of the select area |
getSelectedId | returns the selected elements ids |
getSelectedItem | gets an object of the selected data item |
getSpan | returns the config array for a span or null, if there are no spans |
getSpanNode | returns the HTML element of a spanned cell |
getState | returns the current state of the view |
getSubView | returns the subview of the item with the given id |
getText | returns the text value of a cell |
getTopParentView | returns the top parent view |
getVisibleCount | counts visible rows |
group | groups data by the specified data property |
hasCss | checks if item has specific css class |
hasEvent | checks whether the component has the specified event handler |
hide | hides the view |
hideColumn | hides the specified column |
hideOverlay | hides the previously defined overlay |
ignoreUndo | calls a function that will be ignored in the undo history track |
isBranch | checks whether the node has any children |
isBranchOpen | checks whether the specified branch is open or closed |
isChecked | checks whether the specified node is checked |
isColumnVisible | returns false if the column is hidden |
isEnabled | checks whether the view is enabled |
isSelected | returns true if the related record is selected |
isVisible | checks whether the view is visible |
load | loads data from an external data source |
loadBranch | loads data to the specified branch, as direct children of the node with the ID provided |
loadNext | sends a request to load the specified number of records to the end of the client-side dataset or to the specified position |
locate | converts an HTML node or event object to in-table position |
mapCells | applies the callback to a range of cells |
mapEvent | routes events from one object to another |
mapSelection | executes a method for all cells in the currently selected block |
markSorting | marks the sorted column with arrow (asc/desc) in the header |
move | moves the specified item to a new position |
moveBottom | moves the specified item to the last position |
moveColumn | moves a column to different position |
moveDown | increases the item index and moves the item to the new position |
moveSelection | moves selection in the specified direction |
moveTop | moves the specified item to the first position |
moveUp | decreases the item index and moves the item to the new position |
open | opens the branch with the specified id |
openAll | opens all branches in the tree |
openSub | opens a subrow or subview for an item with the given id |
parse | loads data to the component from an inline data source |
queryView | returns inner element/elements of a widget that correspond(s) to the defined parameters |
refresh | repaints the whole view or a certain item |
refreshColumns | refreshes the structure of DataTable |
refreshFilter | rebuilds the list of options in the select filter |
refreshSelectArea | refreshes the selected area in the DataTable |
registerFilter | adds an external filter for a particular column or data field |
remove | removes the specified item/items from datastore |
removeCellCss | removes a css class from the cell of datatable |
removeCss | removes CSS class from a component item |
removeRowCss | removes a css class from the row |
removeSelectArea | removes a select area |
removeSpan | removes a rowspan/colspan from the datatable |
removeUndo | removes history about all the operations made to an item |
render | renders the specified item or the whole component |
resize | adjusts the view to a new size |
resizeSubView | adjusts the row size to the size of a subview |
scrollTo | scrolls the view to the defined position |
select | selects the specified element |
selectAll | selects all cells in the DataTable |
selectRange | selects the specified range of elements |
serialize | serializes data to an array of JSON objects |
setColumnWidth | sets the width of the specified column |
setPage | makes the specified page visible (assuming that the pager was defined ) |
setRowHeight | sets the height of the specified row |
setState | restores the specified state |
show | makes the component visible |
showCell | scrolls the table (if needed) to make the specified cell visible |
showColumn | shows the column that was previously hidden by method 'hideColumn' |
showColumnBatch | shows or hides a group of columns |
showItem | scrolls the table to make the specified row visible |
showItemByIndex | scrolls the table to make the specified row visible |
showOverlay | shows the overlay message over the body of DataTable |
sort | sorts datastore |
sync | allows syncing two copies of data (all or just a part of it) from one DataCollection to another |
unbind | breaks "bind" link |
unblockEvent | cancels events blocking that was enabled by the 'blockEvent' command |
uncheckAll | uncheck all items in the tree |
uncheckItem | unchecks the checkbox in the tree item |
undo | reverts the previously made change in the component |
ungroup | ungroups data |
unselect | cancels selection of the specified element |
unselectAll | unselects all selected cells in a datatable |
updateItem | updates the data item with new properties |
validate | validates one record or all dataset against the validation rules |
validateEditor | validates data in currently active editor |
waitSave | allows to catch the moment when a data operation was saved to the server |
animate | defines the type of animation, with which the view is shown, if it is a Multiview cell |
areaselect | enables/disables area selection |
autoConfig | datatable adjust configuration to the data |
autoheight | adjusts the height of Datatable to the its content |
autowidth | adjusts the width of Datatable to its content |
blockselect | enables/disables block selection |
borderless | used to hide the component borders |
checkboxRefresh | controls behavior of checkbox editors in grid |
clipboard | enables/disables clipboard support on desktop devices |
columnWidth | defines the default width for columns (in pixels) |
columns | configures columns of the table |
container | an HTML container (or its ID) where the component should be initialized |
css | the name of the CSS class or the object with styles that will be applied to the view container |
data | JavaScript array containing data for the component |
datafetch | defines the number of records that will be loaded into datatable during the next dynamic loading call |
datathrottle | sets the polling interval (the time period between the completion of a network request and the next request for data) |
datatype | the type of loaded data |
delimiter | sets CSV delimiters for clipboard operations |
disabled | indicates whether an item is enabled |
drag | enables or disables drag-and-drop |
dragColumn | enables drag-and-drop support for columns |
dragscroll | enables autoscroll of the component during drag-n-drop |
editMath | enables formula editing |
editValue | defines which data item is editable (in case of several data items in the cell/line) |
editable | allows/denies editing in the view |
editaction | defines the action on which editors will be opened |
externalData | allows defining custom 'move' logic for the component. |
filterMode | defines filtering rules in tree-like components |
fixedRowHeight | defines whether the height should be fixed for all rows or can vary |
footer | enables/disables the footer in DataTable (disabled, by default) |
form | linked form |
gravity | sets the view gravity |
header | enables/disables the header in DataTable (enabled, by default) |
headerRowHeight | sets the height of the header and footer rows |
headermenu | adds a header menu that helps to control the column visibility |
height | sets the height of the component |
hidden | defines whether the view will be hidden initially |
hover | defines a css class for a row-hover in the datatable |
id | the ID of a widget |
keyPressTimeout | a delay between the key press and the action |
leftSplit | the number of the columns fixed to left side of the table (works for the Split Mode) |
liveValidation | enables validation during cell editing |
loadahead | sets the number of items that will be loaded on each scroll movement |
map | defines data mapping |
math | enables math formulas in DataTable |
maxColumnWidth | sets the maximum width for a column |
maxHeight | sets the maximum height for the view |
maxRowHeight | sets the maximum height for a row |
maxWidth | sets the maximum width for the view |
minColumnWidth | sets the minimum width for a column |
minHeight | sets the minimal height for the view |
minRowHeight | sets the minimum height for a row |
minWidth | sets the minimal width for the view |
mouseEventDelay | the delay between a real mouse action and invoking the related events |
multiselect | enables the multi selection mode |
navigation | activates the selection keyboard navigation |
on | allows attaching custom handlers to inner events of the component |
onClick | attaches a click handler for component parts with the specified CSS class |
onContext | a property used to define custom context-click (right click) handlers for elements in the DataTable cells
|
onDblClick | attaches a dblclick behavior for component items with the specified CSS class. |
onMouseMove | attaches a mousemove behavior for component items with the specified CSS class. |
pager | defines paging configuration (creates a "ui.pager" object) |
prerender | invokes the full rendering of data |
ready | the event handler is called just after the component has been completely initialized |
removeMissed | defines how to treat items in case of reloading |
resizeColumn | enables/disables horizontal resizing of columns |
resizeRow | enables/disables vertical resizing of rows |
rightSplit | sets the number of the columns fixed to the right side of the table (works for the Split Mode) |
rowHeight | sets the default height for rows |
rowLineHeight | defines the default line height for a grid row |
rules | set of validation rules for the component |
save | defines URLs for data saving |
scheme | defines schemes for data processing |
scroll | enables or disables scroll for the datatable |
scrollAlignY | enables/disables scrolling the table just by whole rows (i.e. you won't be allowed to scroll along the full length of rows) |
scrollX | enables/disables horizontal scrolling |
scrollY | enables/disables vertical scrolling |
select | sets the selection mode in DataTable |
sort | enables sorting by header click |
spans | sets span configurations for the datatable |
subRowHeight | automatically adjusts the subrow height to the size of the text |
subrow | sets a subrow template |
subview | adds a subview configuration into datatable |
templateCopy | sets the template according to which data will be copied to clipboard from each currently selected cell |
threeState | defines three-state checkboxes for the tree |
tooltip | sets a popup message next to the item when the cursor points to it |
type | used for configuring presentation of items |
undo | enables reverting changes in datatable |
undoLimit | limit of the number of operations to revert |
url | the URL which the component will use to load data after its initialization |
width | sets the width of a widget |
yCount | defines the height of the datatable in rows |