ui.text
An one-line, editable text field with the label inside it.
A label inside the control differs it from the input component. Check text documentation for more detailed description.
Constructor
var text = webix.ui({
view:"text",
container:"mydiv",
...config options goes here..
})
//or, in case of jQuery
$("#mydiv").webix_text({
...config options goes here..
});
Methods
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 |
blur | removes the focus from the control |
callEvent | calls an inner event |
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) |
enable | enables the calling view that was disabled by the 'disable' method |
focus | sets focus to the control |
getChildViews | returns child views of the calling component |
getFormView | returns master form for the input |
getInputNode | gets the HTML element related to the component |
getNode | returns the main HTML container for the calling object |
getParentView | returns the parent view of the component |
getTopParentView | returns top parent view |
getValue | returns the current value of the control |
hasEvent | checks whether the component has the specified event |
hide | hides the view |
isEnabled | checks whether the view is enabled |
isVisible | checks whether the view is visible |
mapEvent | routes events from one object to another |
refresh | repaints the component |
render | renders the specified item or the whole component |
resize | adjusts the view to a new size |
setValue | sets a new value for the component |
show | makes the component visible |
sync | allows you to sync two copy 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 |
validate | validates value of input |
Events
onAfterRender | occurs immediately after the component has been rendered. |
onAfterScroll | occurs when some webix view has been scrolled |
onBeforeRender | occurs immediately before the component has been rendered |
onBindRequest | fires when the component is ready to receive data from the master component |
onChange | fires when the value of the control is changed |
onDestruct | occurs when component destroyed |
onItemClick | fires after the control has been clicked |
onKeyPress | occurs when keyboard key is pressed for the control in focus |
onLongTouch | fires on holding finger in some position for a certain period of time |
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 |
onViewResize | view size was changed by resizer |
Properties
align | the alignment of the control within the parent container |
animate | defines or disables view change animation. |
attributes | sets an hash of HTML input attributes that will be parsed for the Webix input control |
borderless | used to hide the component borders |
click | click action handler |
container | an html container (or its id) where the component needs initializing |
content | the id or node, whose content will be moved to the view |
css | the name of a css class that will be applied to the view container |
disabled | indicates whether an item is enabled or not |
gravity | sets the view gravity (1 by default) |
height | sets the height of the component |
hidden | defines whether the view will be hidden initially |
hotkey | sets a hotkey that triggers button clicking |
id | the component ID |
inputHeight | the height of the input area, or a button's text value area. |
inputPadding | padding of text in the input |
inputWidth | the width of the input area, or a button's text value area. |
label | the text label of the control |
labelPosition | positions label above the control |
labelWidth | the width of the label |
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 |
name | name of the control |
on | allows attaching custom handlers to inner events of the component |
placeholder | placeholder text for the input area |
popup | allows to attach pop-up menu to the button |
readonly | configures readonly mode for the input |
relatedAction | action to call when value of cell changes |
relatedView | id of view, that will be affected by relatedAction operation |
required | marks field as required |
suggest | links suggest list to the input |
tabFocus | defines whether the control will be included in the tab navigation order |
template | the component template |
tooltip | tooltip for the input |
type | the type of the control |
validate | adds validation to the field |
validateEvent | on which event validation fires |
value | sets the initial value for a control |
width | sets the width of the component |
Other
$getSize | returns the current size of the component |
$getValue | called each time when component need to get value from related html input |
$height | current height of the view |
$render | code called after rending control |
$renderIcon | renders icon for the control |
$renderInput | renders html for the input |
$renderLabel | renders html for the label |
$scope | scope for resolving event and method names |
$setSize | sets the component size |
$setValue | called each time when component need to set value in related html input |
$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 | attaches a click behavior for component items with the specified CSS class. |
touchable | flag, which force touch reaction on touch screen devices |
Back to top