WaveMaker - Widgets API Documentation
  1. Classes
  2. Form

File

projects/components/widgets/data/form/src/form.component.doc.ts

Description

The wmForm component defines a form in the layout.

Index

Methods
Inputs

Methods

clearMessage
clearMessage()

This method is used to clear the message in the form in case of inline message layout.

Returns : void
highlightInvalidFields
highlightInvalidFields()

This method loops through the form fields and highlights the invalid fields.

Returns : void
onBeforesubmit
onBeforesubmit($event: MouseEvent, widget: any, $data: any)

Callback is triggered on submit of form and before sending service call. This callback an be used to validate or modify data.

Parameters :
Name Type Optional Description
$event MouseEvent No

DOM event on which call back is triggered
widget any No

Instance of the widget
$data any No

Input data collected from the form widget
Returns : void | boolean

if the callback returns false, form submit is stopped. Anything else, form submit continues with modified data.
onError
onError($event: MouseEvent, widget: any, $data: any)

This event handler is called whenever the form submit returns an error.

Parameters :
Name Type Optional Description
$event MouseEvent No

DOM event on which call back is triggered
widget any No

Instance of the widget
$data any No

response returned from the service call
Returns : void
onPinchin
onPinchin($event: TouchEvent, widget: any)

Callback function which will be triggered when a pinchin event is triggered.

Parameters :
Name Type Optional Description
$event TouchEvent No

DOM event on which call back is triggered
widget any No

Instance of the widget
Returns : void
onPinchout
onPinchout($event: TouchEvent, widget: any)

Callback function which will be triggered when a pinchout event is triggered.

Parameters :
Name Type Optional Description
$event TouchEvent No

DOM event on which call back is triggered
widget any No

Instance of the widget
Returns : void
onResult
onResult($event: MouseEvent, widget: any, $data: any)

This event is called after service call returns response, whether or not the service call was successful.

Parameters :
Name Type Optional Description
$event MouseEvent No

DOM event on which call back is triggered
widget any No

Instance of the widget
$data any No

response returned from the service call
Returns : void
onSubmit
onSubmit($event: MouseEvent, widget: any, $formData: any)

This event handler is called whenever a submit event is triggered.

Parameters :
Name Type Optional Description
$event MouseEvent No

DOM event on which call back is triggered
widget any No

Instance of the widget
$formData any No

Input data collected from the form widget
Returns : void
onSuccess
onSuccess($event: MouseEvent, widget: any, $data: any)

This event handler is called whenever the form submit is success.

Parameters :
Name Type Optional Description
$event MouseEvent No

DOM event on which call back is triggered
widget any No

Instance of the widget
$data any No

response returned from the service call
Returns : void
onSwipedown
onSwipedown($event: TouchEvent, widget: any)

Callback function which will be triggered when a swipedown event is triggered.

Parameters :
Name Type Optional Description
$event TouchEvent No

DOM event on which call back is triggered
widget any No

Instance of the widget
Returns : void
onSwipeleft
onSwipeleft($event: TouchEvent, widget: any)

Callback function which will be triggered when a swipeleft event is triggered.

Parameters :
Name Type Optional Description
$event TouchEvent No

DOM event on which call back is triggered
widget any No

Instance of the widget
Returns : void
onSwiperight
onSwiperight($event: TouchEvent, widget: any)

Callback function which will be triggered when a swiperight event is triggered.

Parameters :
Name Type Optional Description
$event TouchEvent No

DOM event on which call back is triggered
widget any No

Instance of the widget
Returns : void
onSwipeup
onSwipeup($event: TouchEvent, widget: any)

Callback function which will be triggered when a swipeup event is triggered.

Parameters :
Name Type Optional Description
$event TouchEvent No

DOM event on which call back is triggered
widget any No

Instance of the widget
Returns : void
reset
reset()

This method is used to reset the form.

Returns : void
submit
submit()

This method is used to submit the form.

Returns : void
toggleMessage
toggleMessage(show: boolean, msg?: string, type?: string, header?: string)

This method is used to show the message in the form.

Parameters :
Name Type Optional Description
show boolean No

Show or hide the message
msg string Yes

message content
type string Yes

type of the message - error, success, info or warning
header string Yes

title of the message
Returns : void

Inputs

action
Type : string

Defines the action to be performed on successful submission of the form.

Bindable: true
autocomplete
Type : boolean
Default value : false

Enabling this property turns on auto-completion in the editor. As the user types into the pull-down select editor, the choices change dynamically.
captionalign
Type : string
Default value : 'left'

Defines the alignment of the caption elements of widgets inside the form.

Allowed Values: left, center, right

left: Caption is aligned to left.

center: Caption is aligned in center.

right: Caption is aligned to right.
captionposition
Type : string
Default value : 'left'

Defines the position of the caption elements of widgets inside the form.

Allowed Values: left, top, right

left: Caption is positioned to left of form widget.

top: Caption is positioned on top of form widget.

right: Caption is positioned to right of form widget.
captionwidth
Type : string
Default value : 'xs-12 sm-3 md-3 lg-3'

Accepts integer(x) between 1-12 and adds class col-xs-(x) for mobile, col-sm-(x) for Tablet Potrait, col-md-(x) for Laptop Tablet Landscape , col-lg-(x) for Large screen to suit bootstrap fluid grid system.
class
Type : string

Class of the widget.
collapsible
Type : boolean
Default value : false

Enable control for collapsing and expanding the widget.
dataset
Type : any

This property specifies the datasource to which values of form are submitted.

Bindable: true
enctype
Type : string

The encoding type property specifies how the form-data should be encoded when submitting it to the server.

Allowed Values: application/x-www-form-urlencoded, multipart/form-data, text/plain

application/x-www-form-urlencoded: Default. All characters are encoded before send (spaces are converted to "+" symbols, and special characters are converted to ASCII HEX values)

multipart/form-data: No characters are encoded. This value is required when you are using forms that have a file upload control.

text/plain: Spaces are converted to "+" symbols, but no special characters are encoded.
errormessage
Type : string
Default value : 'An error occured. Please try again!'

This message will be displayed, if there is an error during form submit.

Bindable: true
expanded
Type : boolean
Default value : false

Set the default state of the form whether it is expanded or collapsed.
formdata
Type : any

Default data to show in the form on load.

Bindable: true
iconclass
Type : string

CSS class of the icon showed in form header.

Bindable: true
messagelayout
Type : string
Default value : 'Inline'

This property decides the appearance of the success/error message after submit operation.

Allowed Values: Inline, Toaster

Inline: Message is shown at the top of the form widget.

Toaster: Message is shown in the toaster.
method
Type : string

Defines the method to be used for submission of the form to the server.

Allowed Values: get, post, delete

get: Appends the form-data to the URL in name/value pairs: URL?name=value&name=value.

post: Sends the form-data as an HTTP post transaction.

delete: Sends the form-data as an HTTP post transaction with DELETE type.
name
Type : string

Name of the form widget.
postmessage
Type : string
Default value : 'Data posted successfully'

This message will be displayed, when data is posted by form.

Bindable: true
show
Type : boolean

This property will be used to show/hide the form widget on the web page.

Bindable: true
subheading
Type : string

This property defines the sub heading or title for the widget.

Bindable: true
tabindex
Type : number
Default value : 0

This property specifies the tab order of the Form Widget.
target
Type : string

Defines the target for the form.

Allowed Values: _blank, _self, _parent, _top

_blank: The response is displayed in a new window or tab

_self:The response is displayed in the same frame.

_parent: The response is displayed in the parent frame.

_top: The response is displayed in the full body of the window.
title
Type : string

Title of the form.

Bindable: true
validationtype
Type : string
Default value : 'default'

This property defines the type of validation applied on the form.

Allowed Values: default, html, none

default: Inline validations are applied on form submit.

html: HTML 5 validations are applied on form submit.

none: Validations are disabled on form.

results matching ""

    No results matching ""