Html Area
(part of package 'Servoy Extra Components') Extends designtime/SolutionModel: JSWebComponent Extends runtime: RuntimeWebComponent
A Servoy Extra Component that provides a rich HTML editing area.
This is a reference page; many components have detailed usage guides here.
Properties
dataProviderID
Bound data provider identifier for the HTML content. Type: Dataprovider
displaysTags
Flag indicating whether HTML tags should be displayed. Type: Boolean
editable
Flag indicating whether the HTML area is editable. Type: Protected Default Value: true
enabled
Flag indicating whether the HTML area is enabled for user interaction. Type: Enabled Default Value: true
placeholderText
Placeholder text displayed when no HTML content is present. Type: Tagstring
readOnly
Flag indicating whether the HTML area is read-only. Type: ReadOnly
responsiveHeight
Min height of the html editor, set only in responsive forms. Type: Number Default Value: 300
scrollbars
Configuration for the scrollbars in the HTML area. Type: Scrollbars
styleClass
CSS style classes applied to the HTML area component. Type: Styleclass
tabSeq
Tab sequence order for keyboard navigation. Type: Tabseq
text
The HTML content displayed in the editor. Type: Tagstring
toolTipText
Tooltip text displayed when hovering over the HTML area. Type: Tagstring
visible
Flag indicating whether the HTML area is visible. Type: Visible
Events
onActionMethodID(event)
Fired when an action is triggered in the HTML area.
Parameters:
{JSEvent} event The event object containing details about the action event.
onDataChangeMethodID(oldValue,newValue,event)
Fired when the HTML content changes.
Parameters:
{${dataproviderType}} oldValue The previous HTML content.
{${dataproviderType}} newValue The new HTML content.
{JSEvent} event The event object associated with the data change.
Returns: {Boolean}
onFocusGainedMethodID(event)
Fired when the HTML area gains focus.
Parameters:
{JSEvent} event The event object containing details about the focus gained event.
onFocusLostMethodID(event)
Fired when the HTML area loses focus.
Parameters:
{JSEvent} event The event object containing details about the focus lost event.
onRightClickMethodID(event)
Fired when the HTML area is right-clicked.
Parameters:
{JSEvent} event The event object containing details about the right-click event.
API
getAsPlainText()
Gets the plain text for the formatted Html Area.
Example:
var my_text = myElement.getAsPlainText();
Returns: String The plain text
getScrollX()
Returns the x scroll location of specified element - only for an element where height of element is less than the height of element content. NOTE: getScrollX() can be used with getScrollY() to set the scroll location of an element using the setScroll function.
For Example:
//returns the X and Y scroll coordinates
var x = forms.company.elements.myarea.getScrollX();
var y = forms.company.elements.myarea.getScrollY();
//sets the new scroll location
forms.company.elements.myarea.setScroll(x+10,y+10);
Example:
var x = myElement.getScrollX();
Returns: Number The x scroll location in pixels.
getScrollY()
Returns the y scroll location of specified element - only for an element where height of element is less than the height of element content. NOTE: getScrollY() can be used with getScrollX() to set the scroll location of an element using the setScroll function.
For Example:
//returns the X and Y scroll coordinates
var x = forms.company.elements.myarea.getScrollX();
var y = forms.company.elements.myarea.getScrollY();
//sets the new scroll location
forms.company.elements.myarea.setScroll(x+10,y+10);
Example:
var y = myElement.getScrollY();
Returns: Number The y scroll location in pixels.
getSelectedText()
Returns the currently selected text in the specified Html Area.
Example:
var my_text = myElement.getSelectedText();
Returns: String The selected text in the Html Area.
replaceSelectedText(selectedText)
Replaces the selected text; if no text has been selected, the replaced value will be inserted at the last cursor position.
Example:
myElement.replaceSelectedText('John');
Parameters:
{String} selectedText The replacement text
Returns: String The new content after replace.
requestFocus(mustExecuteOnFocusGainedMethod)
Set the focus to this Html Area.
Example:
myElement.requestFocus();
Parameters:
{Boolean} [mustExecuteOnFocusGainedMethod] If false will not execute the onFocusGained method; the default value is true[0m
selectAll()
Selects all the contents of the Html Area.
Example:
myElement.selectAll();
setScroll(x,y)
Sets the scroll location of an element. It takes as input the X (horizontal) and Y (vertical) coordinates - starting from the TOP LEFT side of the screen - only for an element where the height of the element is greater than the height of element content NOTE: getScrollX() can be used with getScrollY() to return the current scroll location of an element; then use the X and Y coordinates with the setScroll function to set a new scroll location.
For Example:
//returns the X and Y coordinates
var x = forms.company.elements.myarea.getScrollX();
var y = forms.company.elements.myarea.getScrollY();
//sets the new location
forms.company.elements.myarea.setScroll(x+10,y+10);
Example:
myElement.setScroll(200,200);
Parameters:
Last updated
Was this helpful?