# new RichTextField()
Its a Custom Web Component. Do not use the constructor directly with the new keyword. Instead, use one of the 2 following methods:
Create the Web Component and call its init method:
const myRichTextField = document.createElement("a-richtextfield").init(config)
Or use the shorthand for it:
const myRichTextField = createRichTextField({
label: "My rich text field",
width: 600,
labelPosition: "top"
})
myRichTextField.render()
Or directly declare the config inside a container component:
const myPanel = createPanel({
title: "My panel",
items: [
{
type: "richTextField",
label: "My rich text field",
width: 600,
labelPosition: "top"
}
]
})
myPanel.render()
Parameters:
Name | Type | Attributes | Description |
---|---|---|---|
config.value |
string
|
<optional> |
Default value |
config.label |
string
|
<optional> |
|
config.readOnly |
boolean
|
<optional> |
|
config.disabled |
boolean
|
<optional> |
|
config.required |
boolean
|
<optional> |
|
config.labelWidth |
string
|
number
|
<optional> |
|
config.fieldWidth |
string
|
number
|
<optional> |
|
config.fieldPadding |
string
|
<optional> |
|
config.labelPosition |
string
|
<optional> |
left | right | top | bottom |
config.labelAlign |
string
|
<optional> |
left | right |
config.boxShadow |
number
|
<optional> |
|
config.width |
integer
|
<optional> |
Width in pixels |
config.height |
integer
|
<optional> |
Height in pixels |
config.useCDN |
boolean
|
<optional> |
Set to true to use the CDN version of Quill. Default is true. |
this
Generated markup
<a-richtextfield class="a-richtextfield">
<label class="field-label"></label>
<div class="field-richtext">
<!-- Quill editor is here !-->
</div>
</a-richtextfield>
Methods
# setFieldWidth(width)
Set the color selector field width
Parameters:
Name | Type | Description |
---|---|---|
width |
*
|
this
# setLabelPosition(position)
Set label position
Parameters:
Name | Type | Description |
---|---|---|
position |
string
|
"left" (default) | "right" | "top" | "bottom" |
this
# setValue(newValue, fromBlurEventopt)
Set the code
Parameters:
Name | Type | Attributes | Description |
---|---|---|---|
newValue |
string
|
||
fromBlurEvent |
boolean
|
<optional> |
If true, the update is only performed on binded record, not locally |
this
# validate() → {boolean}
Validate the field value and apply UI style accordingly
true is the field is valid, false otherwise
boolean