form.view
FormView : d2/sdk/controls/form/form.view
FormView. Create and render an arbitrary HTML form using JSON schema. Form also provides manage API to validate & collect form data.
Uses FormModel
to hold the JSON schema that drives the form rendering. See FormModel for examples of how to
create a FormModel
from literal JSON data and dialog-like D2-REST API response.
Extends: Marionette.ItemView
Emits: d2:change:formValidation
, change:field
, valid:field
, invalid:field
, form:changed
, render:form
Example (To create a form view)
define([
'd2/sdk/controls/form/form.view',
'd2/sdk/controls/form/form.model'
], function(FormView, FormModel){
'use strict';
var formOptions = {
topAlignedLabel: true,
mode: 'create',
layoutMode: 'singleCol',
model: createFormModel()
};
function createFormModel() {
var formSchema;
// populate form schema
return new FormModel(formSchema);
}
var formView = new FormView(formOptions); //For controlling any business specific, behavior FormView could be extended to attach business specific logic
formView.on('render:form', function(){
console.log('Form is rendered');
});
new Marionette.Region({el: '.my-form-container'}).show(formView);
});
- FormView :
d2/sdk/controls/form/form.view
- instance
- inner
formView.resetForm() ⇒ void
Reset the current form removing all user inputs.
Kind: instance method of FormView
formView.validateForm(refreshState, validateOnlyRequiredFields) ⇒ jQyery.Promise
Validate current form values and ensure form contraints are met.
Kind: instance method of FormView
Returns: jQyery.Promise
- - Promise is resolved with validation status. A FormValidationDone
callback could be invoked with the validation result.
Param | Type | Description |
---|---|---|
refreshState | Boolean | Whether to clear previous validation status before running this one. |
validateOnlyRequiredFields | Boolean | Whether to perform only a required field validation or all other contraints as well. |
formView.getValues() ⇒ object
Get current field values
Kind: instance method of FormView
Returns: object
- A JSON in the same structure as the form's field layout definition, it contains key-value pairs at each level where key corresponds
to form field name and value corresponds to the data collected from the field.
formView.getFlatFormValueMap(valueMap) ⇒ object
Get current field values formatted as a flattened single level key-value hash.
Kind: instance method of FormView
Returns: object
- Flattened key-value map.
Param | Type | Description |
---|---|---|
valueMap | object | The hierarchical form value map. Basically the return value of |
"d2:change:formValidation"
Indicates form validation status has changed.
Kind: event emitted by FormView
"change:field"
Indicates a field value has been updated.
Kind: event emitted by FormView
"valid:field"
Indicates a field cotains a valid value.
Kind: event emitted by FormView
"invalid:field"
Indicates a field contains an invalid value.
Kind: event emitted by FormView
"form:changed"
Indicates that form data has changed somehow.
Kind: event emitted by FormView
"render:form"
Indicates that form has been fully rendered in UI
Kind: event emitted by FormView
FormView~FormView
Kind: inner class of FormView
new FormView(options)
Param | Type | Description |
---|---|---|
options | object | Constructor options |
options.model | FormModel | The data holder having schema definition for this form instance. |
options.context | Context | Reference to the application context. |
[options.topAlignedLabel] | Boolean | Whether to place label at the top of form field or side-by-side fashion. Defaults to |
[options.mode] | string | Controls rendering of the form. Possible values are |
[options.layoutMode] | string | Whether to layout the form in a single or double column fashion. Supported values are |
FormView~FormValidationCallback : function
Kind: inner typedef of FormView
Param | Type | Description |
---|---|---|
isValid | Boolean | Whether the form is valid. |