A menu of individually selectable items.
The component can be displayed in 2 modes: static (the menu is fully expanded all the time) and dynamic (only the parent item is static, while its childs are displayed only when the user holds the mouse pointer over the parent). You can configure any nesting level complexity. Check menu documentation for more detailed description.
add | adds an item to the store |
addCss | applied CSS class to a component item |
adjust | adjusts the component to the size of the parent HTML container |
attachEvent | attaches the handler to an inner event of the component (allows behaviour customizations) |
bind | binds components |
blockEvent | temporarily blocks triggering of ALL events of the calling object |
callEvent | calls an inner event |
clearAll | removes all items from the component |
clearCss | removes css class from all items |
clearValidation | removes all validation marks from the component |
copy | copies an item to the same or another object |
count | returns the number of currently visible items |
customize | redefines the "type" property |
define | redefines a single configuration property (or a hash of 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) |
disableItem | disables menu item |
enable | enables the calling view that was disabled by the 'disable' method |
enableItem | enables menu item |
exists | checks whether an item with the specified id exists |
filter | filters the component |
getChildViews | returns child views of the calling component |
getFirstId | returns the ID of the first item |
getFormView | returns master form for the input |
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 |
getMenu | gets object of a menu/submenu where an item is located |
getMenuItem | search for menu item in submenus |
getNextId | returns the ID of an item which is positioned the specified step after the specified item |
getNode | returns the main HTML container for the calling object |
getPage | returns the currently visible page in case of paged view |
getPager | returns the pager object associated with the component |
getParentView | returns the parent view of the component |
getPrevId | returns the ID of an item which is positioned the specified step before the specified item |
getScrollState | returns the scroll position |
getSelectedId | returns the id(s) of the selected item(s) |
getSelectedItem | returns selected object |
getSubMenu | gets the submenu object of a menu item (if any) |
getTopMenu | returns top menu object |
getTopParentView | returns top parent view |
getVisibleCount | returns the number of items that can be seen with the current view height |
hasCss | checks if item has specific css class |
hasEvent | checks whether the component has the specified event |
hide | hides the view |
hideItem | hides menu item |
isEnabled | checks whether the view is enabled |
isSelected | checks whether the specified item is selected or not |
isVisible | checks whether the view is visible |
load | loads data from an external data source. |
loadNext | sends a request to load the specified number of records to the end of the clientside dataset or to the specified position |
locate | gets the id of an item from the specified HTML event |
mapEvent | routes events from one object to another |
move | moves the specified item to the new position |
moveBottom | moves the specified item to the last 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 |
parse | loads data to the component from an inline data source |
refresh | repaints the whole view or a certain item |
remove | removes the specified item from datastore |
removeCss | removes CSS class from a component item |
render | renders the specified item or the whole component |
resize | adjusts the view to a new size |
scrollTo | scrolls the data container to a certain position |
select | selects the specified item(s) |
selectAll | selects all items or the specified range |
serialize | serializes data to a JSON object |
setPage | makes the specified page visible (assuming that the pager was defined ) |
show | makes the component visible |
showItem | scrolls the component to make the specified item visible |
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 blocking events that was enabled by the 'blockEvent' command |
unselect | removes selection from the specified item |
unselectAll | removes selection from all items |
updateItem | sets properties of the data item |
validate | validates one record or all dataset against validation rules |
onAfterAdd | fires after adding item to datastore |
onAfterContextMenu | fires after the context menu was called in the item area |
onAfterDelete | fires after item deleting |
onAfterDrop | fires after drag-n-drop was finished |
onAfterLoad | fires after server side loading is complete |
onAfterRender | occurs immediately after the component has been rendered |
onAfterScroll | occurs when some webix view has been scrolled |
onAfterSelect | fires after item was selected |
onAfterSort | fires after sorting dataset |
onBeforeAdd | fires before adding item to datastore |
onBeforeContextMenu | fires before the context menu is called in the item area |
onBeforeDelete | fires before item deleting |
onBeforeDrag | fires before the mouse button is pressed and the cursor is moved over a draggable item |
onBeforeDragIn | fires before a dragged element is moved over the droppable area |
onBeforeDrop | fires before a dragged element is released over the droppable area |
onBeforeDropOut | fires before a dragged element is released over the droppable area |
onBeforeLoad | occurs immediately before data loading has been started |
onBeforeRender | occurs immediately before the component has been rendered |
onBeforeSelect | fires before item selection is started |
onBeforeSort | fires before sorting dataset |
onBindRequest | fires when the component is ready to receive data from the master component |
onDataRequest | fires when data from the server is requested for linear data structures (List, DataTable, DataView etc.) to implement dynamic data loading |
onDataUpdate | fires when data item is in update process |
onDestruct | occurs when component destroyed |
onDragOut | fires when a dragged element is moved outside of the droppable area |
onItemClick | fires when a component item was clicked |
onItemDblClick | fires when a component item was double-clicked |
onItemRender | for each item rendering, occurs only for items with custom templates |
onKeyPress | occurs when keyboard key is pressed for the control in focus |
onLoadError | fires when an error occurs during data loading ( invalid server side response ) |
onLongTouch | fires on holding finger in some position for a certain period of time |
onMenuItemClick | fires when menu item has been clicked |
onMouseMove | fires when the mouse was moved over the specified component |
onMouseMoving | fires when the mouse was moved over the component |
onMouseOut | fires when the mouse was moved out from the specified item |
onPaste | fires when the user presses CTRL+V keys combination |
onSelectChange | fires after selection state was changed |
onSwipeX | occurs on a horizontal swipe movement |
onSwipeY | occurs on a vertical swipe movement |
onTimedKeyPress | fires after typing has been finished in the field |
onTouchEnd | occurs when the touch event is ended |
onTouchMove | occurs during touch movement |
onTouchStart | when some webix view has been touched |
onValidationError | fires when newly loaded/added/edited data fails to pass validation |
onValidationSuccess | fires after the newlyloaded/added/edited data has passes validation successfully |
onViewResize | view size was changed by resizer |
animate | defines or disables view change animation. |
autoheight | height of view will be adjusted to show all items |
autowidth | width of view will be adjusted to show all items |
borderless | used to hide the component borders |
click | sets an action happening on a button click |
clipboard | enables/disables clipboard support |
container | an html container (or its id) where the component needs initializing |
css | the name of a css class that will be applied to the view container |
data | JavaScript array containing data for the component |
dataFeed | the URL that the component will use to reload data during binding |
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 |
disabled | indicates whether an item is enabled or not |
drag | enables or disables drag-and-drop |
dragscroll | enables autoscroll of component during drag-n-drop |
externalData | allows defining custom 'move' logic for the component. |
gravity | sets the view gravity (1 by default) |
height | sets the height of the component |
hidden | defines whether the view will be hidden initially |
id | the component ID |
layout | defines x or y orientation of layout |
maxHeight | sets the maximum height for the view |
maxWidth | sets the maximum width for the view |
minHeight | sets the minimal height for the view |
minWidth | sets the minimal width for the view |
mouseEventDelay | the delay between a real mouse action and invoking the related events |
navigation | activates the selection keyboard navigation |
on | allows attaching custom handlers to inner events of the component |
onClick | attaches a click behavior for component items 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 behaviour for component items with the specified CSS class. |
pager | defines paging configuration ( creates a 'ui.pager' object) |
ready | event handler called just after the component has been completely initialized |
removeMissed | defines how to treat items in case of reloading |
rules | set of validation rules for the component |
save | defines URLs for data saving |
scheme | defines schemes for data processing |
scroll | enables/disables the scroll bar |
scrollSpeed | the time during which the component is scrolled to the specified position (in milliseconds) |
select | enables/disables item selection or multiselection in grouplist |
subMenuPos | aligns submenu towards main menu |
submenu | defines submenu configuration |
template | the component template |
templateCopy | sets the template according to which data will be copied to the clipboard |
tooltip | sets a popup message appearing on pointing a mouse cursor over the dedicated item. |
type | object that specifies items presentation |
url | the URL the component will use to load data after its initialization |
width | sets the width of the component |
xCount | defines width of view in items |
yCount | defines height of view in items |
$drag | method called when drag operation initiated |
$dragHTML | defines how dragged item will look |
$dragIn | method called when item moved on possible drop landing during dnd |
$dragMark | method called during dnd when some item in the component need to be marked as active drop target |
$dragOut | method called when item moved out of possible drop landing during dnd |
$drop | method called when item dragged and dropped on valid target |
$dropAllow | can be redefine if you need custom drop rules |
$getSize | returns the current size of the component |
$height | current height of the view |
$scope | scope for resolving event and method names |
$setSize | sets the component size |
$skin | method, which will be called when skin defined |
$view | reference to top html element of the view |
$width | current width of the view |
config | all options from initial component configuration |
name | indicates the name of the component (a read-only property) |
on_click | redefines default click behavior for component items. |
on_context | a property used to define custom context-click (right click) handlers for elements in the DataTable cells
|
on_dblclick | attaches a dblclick behavior for component items with the specified CSS class. |
on_mouse_move | attaches a dblclick behavior for component items with the specified CSS class. |
type | set of properties and helpers for item rendering |
types | collection of possible types |