Form

Component for creating forms.

Props

inputs Object mandatory

Object that defines the props of the input form, where the key is the id of the input. See the component Input.

inputs: {
  name: {
    label: "Product Name"
  },
  price: {
    label: "Price",
    component: "masked",
    maskType: "currency"
  }
}

action String

URL address to send the form data.

default: ''

data Object

Map to the values ​​of the inputs, where the key is the id of the input and the value of this is the value associated with the input.

default: {}
data: {
  name: 'Ballpoint Pen',
  price: 1.85
}

method String

Http method used to send the form data.

default: "POST"

dataType String

Data type expected in the server response. See detailed documentation JQuery.ajax.

default: Automático (xml, json, script, html)
"xml"

Response as an XML document.

"html"

Response as HTML document.

"script"

Response as JavaScript code.

"json"

Response as JSON document.

"jsonp"

Response as JSON document using JSONP.

"text"

Answer as a text document.

Multiple values ​​separated by space

Converts the document received from a certain type to another. For example, for a text type response is treated as an XML object, use text xml .

contentType String

Data type sent in the request to the server. See more in W3C/Forms.

default: "application/x-www-form-urlencoded"

multipart Boolean

If true, specifies that the form should use multipart/form-data as contentType.

default: false

style String

Style grid of inputs specified in the theme settings.

default: "default"
Realize.themes.myCustomTheme = {
  form: {
    cssClass: 'custom-form'
  }
};

// In the form properties
{
  style: "myCustomTheme",
  ...
}

themeClassKey String

Key assigned to the object specified in the theme settings.

default: "form"

resource String

This property is used to change the inputs name and id generated by the Form component. See the Input component for more information and examples.

default: null

submitButton Object

Attributes button submit .

name String

Name the submit button or key string location of the resource settings i18n and l10n.

default: "actions.send"
icon String

Icon name used on the button.

default: "send"

otherButtons Object

List of objects specifying the proposed additional buttons on the form. See the component Button.

default: []
otherButtons: [
  {
    name: 'actions.clear',
    icon: 'delete'
    element: 'button',
    type: 'reset'
  }
]

isLoading Boolean

If true, it reports that the component is being loaded.

default: false

onSubmit Function

Function callback executed when receiving event submit.

default: function(event, postData) {}

onReset Function

Function callback executed when receiving event of reset.

default: function(event) {}

ajaxSubmit Boolean

Case of true, the backend requests will be made with ajax.

default: true

disabled Boolean

If true, itens from Form are going to be disabled.

default: false

readOnly Boolean

In case of true, itens from Form will be read only.

default: false