Form Widget

action

enctype

Sets the enctype attribute of the form element.

$A.newForm({enctype: 'multipart/form-data'}).draw();
            

$A.newForm().enctype('multipart/form-data').draw();
            

var form = $A.newForm().draw();
//Setter
form.enctype('multipart/form-data'); //returns form

//Getter
console.log(form.enctype()); //returns value of enctype
            

htmls

By using this option you can insert html code on your form.

$A.newForm({htmls: ['<div>html content</div>']}).draw();
            

$A.newForm().htmls(['<div>html content</div>']).draw();
            

var form = $A.newForm().draw();
//Setter
form.htmls(['<div>html content</div>']); //returns form
/*
    form.htmls($('.element-to-insert')); //adding jQuery elements
*/

//Getter
console.log(form.htmls()); //returns the htmls array
            

inputs

The array of inputs added to the form.

$A.newForm({inputs: [$A.newInput(), $A.newInput()]}).draw();
            

$A.newForm().inputs([$A.newInput(), $A.newInput()]).draw();
            

var form = $A.newForm().draw();
//Setter
form.inputs([$A.newInput(), $A.newInput()]); //returns form

//Getter
console.log(form.inputs()); //returns the inputs array
            

method

Use this option to set the method of the form element.

$A.newForm({method: 'POST'}).draw();
            

$A.newForm().method('POST').draw();
            

var form=$A.newForm().draw();
//Setter
form.method('POST'); //returns form

//Getter
console.log(form.method()); //returns value of method
            

target

If set in constructor, the form will be automatically drawn to the target element.

$A.newForm({taget: $('body')});
            

addGroup(obj)

Use this method to create groups of elements on your form.

• obj
  Type: Object
  The object which represents the elements you want to add to the group.

$A.newForm().draw().addGroup({
    text: 'More options',
    inputs: [
        {
            label: 'Import file',
            help: "Select a file to upload that contains contact data that you want to import.",
            type: 'file',
            name: 'import-subscribers',
            accept: ['.csv', '.rar', '.zip', '.tar', '.gz']
        },
        {
            label: 'Apple',
            validator: 'notEmpty'
        }
    ]});
            

addGroups(arr)

Use this function to add multiple groups to your form at once.

• arr
  Type: Array
  The array of object to be added as groups.

$A.newForm().draw().addGroups([
    {
        text: 'Group 1',
        inputs: [
            {
                label: 'Import file',
                help: "Select a file to upload that contains contact data that you want to import.",
                type: 'file',
                name: 'import-subscribers',
                accept: ['.csv', '.rar', '.zip', '.tar', '.gz']
            },
            {
                label: 'Apple',
                validator: 'notEmpty'
            }
        ]
    },
    {
        text: 'Group 2',
        inputs: [
            {
                label: $A.translate('Stuff')
            }
        ]
    }]);
            

addHtml(html)

Use this method to add html code to your form.

• html
  Type: String | jQuery
  The element which will be inserted.

var form = $A.newForm().draw();
form.addHtml(['<div>html content</div>']); //returns form
form.addHtml($('.elements-to-insert')); //adding jQuery elements
            

addInput(obj)

Use this method ta add an input to your form.

• obj
  Type: Input
  The input you want to add to the form.

$A.newForm().addInput($A.newInput()).draw();
            

addInput(arr)

Use this method ta add multiple inputs to your form.

• arr
  Type: Array
  The array of inputs you want to add to your form.

$A.newForm().addInputs([$A.newInput(),$A.newInput()]).draw();
            

addSubTitle(str)

Use this method to add a subtitle to your form.
Subtitles will be displayed in new rows.

• str
  Type: String
  The text of the subtitle.

$A.newForm().addSubTitle('Title').draw();
            

break

Use this method to break line in your form.
Tehnically, a <br> tag will be appended to the widget's html.

 //regardless the newRow: false attribute of the inputs, they'll be shown in new lines
$A.newForm().addInput({newRow: false}).break().addInput({newRow: false}).draw();
            

draw($target)

Invoke this function to draw the widget after initialization on the target element.
Invoking without parameter sets $('body') as target.

$A.newForm().addInput().draw()          
            

var container = $('<div id="form-container"></div>').css({height: '200px', margin: '20px 10px', border:'2px solid #FF0000', position:'relative'}).appendTo('body')
var form = $A.newForm();
form.addInput(); 
form.draw(container);          
            

group

groups(arr)

hide()

Invoke this function to hide the widget.

var form = $A.newForm().draw();
form.addInput();
setTimeout(function (){
    form.hide();
},1000);
            

input

json

Use this method to JSON stringify your from.

var form = $A.newForm({
        inputs: [$A.newInput({label: 'Name:', value: 'John'})]
    }).draw();
console.log(form.json());
            

object

Use this method to serializy the form.

var form = $A.newForm({
        inputs: [$A.newInput({label: 'Name:', value: 'John'})]
    }).draw();
console.log(form.object());
            

removeGroup(id)

Use this method to remove a group from your form.

• id
  Type: String
  The id of the html element representing the group.

Give some examples here!
            

removeHtml(id)

Use this method to remove a html from your form.

• id
  Type: String
  The id of the html element.

var form = $A.newForm().addHtml('content').draw();
var id = form.htmls()[0].attr('id');
setTimeout(function(){
    form.removeHtml(id);
},1000);
            

removeInput(obj)

Use this method to remove an input from the form.

• obj
  Type: Object | String
  The input object you want to remove, or its id.

var form = $A.newForm().draw();
var input = $A.newInput().draw();
form.addInput(input);
setTimeout(function (){
    form.removeInput(input);
    }, 1000);
            

removeSubTitle(obj)

Use this to remove a subtitle from your form.

• obj
  Type: Object | String
  The subtitle you want to remove, or its id.

var form = $A.newForm().draw();
form.addSubTitle('title');
setTimeout(function (){
    form.removeSubTitle($($('.automizy-form-subtitle')[0]).attr('id'));
    }, 1000);
            

show()

Invoke this function to show the widget.

var form = $A.newForm().draw().hide();
form.addInput();
setTimeout(function(){
    form.show();
},1000);          
            

submit

Use this method to submit the form.

var form = $A.newInput().draw().submit();
        

subTitle(str)

validate

Use this method to run the validation process on all inputs in the form.

var form = $A.newInput().validator('email').draw().validate();