Monster.Components.Form. Form

This CustomControl creates a form element with a variety of options.

Dependencies: the system uses functions of the monsterjs library.

You can create this control either by specifying the HTML tag <monster-form /> directly in the HTML or using Javascript via the document.createElement('monster-form'); method.

<monster-form></monster-form>

Or you can create this CustomControl directly in Javascript:

import {Form} from '@schukai/component-form/source/form.js';
document.createElement('monster-form');

Constructor

new Form()

A configurable form control

Since
  • 1.6.0
Copyright
  • schukai GmbH
Throws:

the options attribute does not contain a valid json definition.

Type
Error

Members

defaults

To set the options via the html tag the attribute data-monster-options must be used.

To set the options via the html tag the attribute data-monster-options must be used.

Properties
NameTypeDescription
templatesObject

Template definitions

Properties
NameTypeDescription
mainstring

Main template

datasourceDatasource

data source

reportValidityObject
Properties
NameTypeDescription
selectorstring

which element should be used to report the validity

errorHandlerfunction

function to handle the error

classesObject
Properties
NameTypeDescription
buttonstring

class for the form

See

(static) instanceSymbol

This method is called by the instanceof operator.

This method is called by the instanceof operator.

Since
  • 2.1.0

Methods

assembleMethodSymbol() → {Monster.Components.Form.Form}

Returns:
Type: 
Monster.Components.Form.Form

connectedCallback() → {void}

Called every time the element is inserted into the DOM.

Called every time the element is inserted into the DOM. Useful for running setup code, such as fetching resources or rendering. Generally, you should try to delay work until this time.

Returns:
Type: 
void

getValues() → {*}

Returns:
Type: 
*

refresh() → {Form}

The refresh method is called to update the control after a change with fresh data.

The refresh method is called to update the control after a change with fresh data.

Therefore, the data source is called again and the data is updated.

If you have updated the data source with `setOption('datasource',datasource), you must call this method.

Throws:

undefined datasource

Type
Error
Returns:
Type: 
Form

reportValidity() → {boolean}

Run reportValidation on all child html form controls.

Run reportValidation on all child html form controls.

Since
  • 2.10.0
Returns:
Type: 
boolean

(static) getCSSStyleSheet() → {CSSStyleSheet}

Returns:
Type: 
CSSStyleSheet

(static) getDatasources() → {Map}

Get registered data sources

.

Get registered data sources

Returns:
Type: 
Map

(static) getTag() → {string}

Returns:
Type: 
string

(static) registerDatasource(name, datasource)

Register a new datasource

.

Register a new datasource

Parameters:
NameTypeDescription
namestring
datasourceMonster.Data.Datasource

(static) unregisterDatasource(name)

Unregister a registered datasource

.

Unregister a registered datasource

Parameters:
NameTypeDescription
namestring