Class: Form

Form

Form holds all queries for a certain form, initiates valiadation, is able to make a valitation summary and takes care of things like title and form wrapping.

Constructor

new Form(data, indexopt)

Create Form.
Parameters:
Name Type Attributes Description
data Object An object defining the properties of a Form.
Properties
Name Type Attributes Description
baseElement dom Tells the Form which DOM object it should use to insert itself.
title string <optional>
 Defines a title content for the new Form.
titleTagName string <optional>
 Defines a title tag name, like for example h1, h2, h3 or span, to be used in the new Form.
allowCorrections boolean <optional>
 Tells whether corrections are enforced prior submitting. If set to true the form will only submit itself once all data is filled in correctly. If set to false the form will submit itself even with wrong answers set.
scrollToError boolean <optional>
 If set to true the Form will scroll to the first wrong answer prior to submitting. This only works in combination with "data.allowCorrections = true".
type string <optional>
 If set to "showSummary" it will display its own basic summary screen with the list of all input items and their answers after submit is complete.
customSubmit boolean <optional>
 If set to true, a custom submit will be used instead of the default one.
submitBtn dom <optional>
 If set and customSubmit set to true the passed one will be used instead.
submitEvent function <optional>
 If defined the specified function will be called upon submiting the event with an event passed as an argument and this set to be an instance of this object.
submit string <optional>
 Defines a value shown on a submit button.
submitUrl string <optional>
 Defines a url on which a post XMLHttpRequest should be submited using POST method.
draggable string | function <optional>
 Defines one of the default draggable plugins (jQuery|interact) or a custom one by passing a function. Default is interact.js.
index number <optional>
 Defines index of the current form.
Source:

Members

sectionContainer

Get section container, that is this.baseForm which has been either passed upon initialization or created automatically.
Source:

Methods

addQuery(queryItem) → {QueryItem|false}

Add query to DOM on this form
Parameters:
Name Type Description
queryItem QueryItem A QueryItem to be logged in the internal structure and appended to the form element.
Source:
Returns:
- Returns the registerd QueryItem or false if no QueryItem was passed.
Type
QueryItem | false

createQuery(queryData) → {QueryItem|false}

Create a new query (QueryItem + QueryDataBlock) on this form
Parameters:
Name Type Description
queryData QueryDataBlock | Object A QueryDataBlock to be used with the new QueryItem or an Object convertible to QueryDataBlock.
Source:
See:
  • QueryDataBlock for more information on the required Object structure.
Returns:
- Returns the newly created QueryItem or false if no QueryData was passed.
Type
QueryItem | false

createSubmit() → {dom}

Creates form submit tag.
Source:
Returns:
- The newly created form DOM submit button.
Type
dom

createTitle() → {dom}

Creates form title tag.
Source:
Returns:
- The newly created form DOM title tag.
Type
dom

getFirstInvalidItem(passAll) → {Object|null}

Get first invalid input item.
Parameters:
Name Type Description
passAll boolean If set to false it won't go through each item and break on first error found.
Source:
Returns:
- An object with the first invalid InputItem from the beginning and numeric queryIndex, or null if all items are valid.
Type
Object | null

isValid() → {boolean}

Checks whether the form is valid or not.
Source:
Returns:
- Return true if all input data is valid, false if not.
Type
boolean

newQueryItem(queryData) → {QueryItem|false}

Adds a new QueryItem to the Form
Parameters:
Name Type Description
queryData QueryDataBlock | Object A QueryDataBlock to be used with the new QueryItem or an Object convertible to QueryDataBlock, @see QueryDataBlock.
Source:
Returns:
- Returns the registerd QueryItem or false if no QueryItem was passed.
Type
QueryItem | false

queryValues() → {Array.<string>}

Returns an array of form input values.
Source:
Returns:
- Array of values for each registered each QueryItem.
Type
Array.<string>

serialize() → {string}

Serializes form data and returns them in a string.
Source:
Returns:
- Serialized Form data.
Type
string

setOnSubmitEvent(call) → {boolean}

Define what should be called upon submitting the form using submit event. Once the callback function is called it will receive the event via its parameter and this set to the instance of this Form class. Always prevents default form submit event.
Parameters:
Name Type Description
call function A function that should be called upon submitting the form.
Source:
Returns:
- True if this.baseForm and call was defined and event set up, false if not.
Type
boolean

showSubmitSummary(keepFormopt) → {Form}

Show a simple built-in form submit summary in place of the original form.
Parameters:
Name Type Attributes Description
keepForm boolean <optional>
 If set to true the form will not be remove from the DOM and the submit summary will display below it.
Source:
Returns:
- Instance of this Form.
Type
Form

submitProcess() → {boolean}

Walks trhough the full submit form process taking care of corrections if allowed and posting data using POST method to a specified url.
Source:
Returns:
- True if submit process completed or false if there were validation issues and corrections were allowed.
Type
boolean

validate() → {boolean}

Validates all form fields by calling each QueryItem validation. In addition scrolls to the first invalid element if there is such.
Source:
Returns:
- Returns true if all field are valid, false if not.
Type
boolean

validationSummary() → {object}

Gets validation summary object containing an array of relevant form submit data.
Source:
Returns:
- An object with the following structure: { items: [allValid, title, subtitle, type, queryValues], itemsLength }
Type
object