CoT Forms

 {
   //these first four are the same as the properties passed to new cot_form()
   id: 'my_form_id',
   title: 'My Form',
   rootPath: '/resources/my_app/', //only required when using any validationtype=Phone fields
   success: someFunctionDefinedSomewhereElse,

   useBinding: true, //defaults to false, set to true to use data binding with a CotModel object.
   //use in conjunction with the setModel method of CotForm and the bindTo attribute of field definitions

   sections: [ //an array of sections on the form
     {
       //these first three are the same as the properties passed to new cot_section()
       id: 'section_one',
       title: 'Section One',
       className: 'Some special class'
       readSectionName:true, // optional enum: [true,false]. If true, screenreaders  will read the section title before each fields title of the section. Used when you have sections which fields looking the same.
       rows: [ //an array of rows within the current section
         { //for each row, specify a grid OR an array of fields:
           fields: [ //an array of fields within the current row
             {
               type: '', //optional, enum: ['number','email', 'phone', 'hidden','html', 'button', 'static', 'checkbox', 'radio', 'text' (default), 'daterangepicker', 'dropdown', 'multiselect', 'datetimepicker', 'textarea', 'password'], the type of field to add to the row
               // NOTE: When field type is 'phone' or 'email', validationtype is not necessary anymore. It will be added automatically
               id: 'field_one', //required, used to create the dom element id
               title: '', //required except for type=html|button|static, the title/label for the field
               className: 'col-xs-6', //optional, override the auto-generated css grid col classes, ex: col-xs-12
               //NOTE: if type=button, className is applied to button as well. if you DO NOT want this behaviour, you can explicitly specify the btnClass option below
               btnClass: 'success', //optional, only applies when type=button, defaults to 'success', determines the bootstrap btn-x class used to style the button, valid values are here: http://getbootstrap.com/css/#buttons-options
               orientation: 'horizontal', //optional, enum: ['horizontal','vertical']. default is vertical. this affects fields like radio
               addclass: 'additional-class', //optional, append to the auto-generated classes
               required: false, //optional, defaults to false
               requiredMessage: '', //optional, if required is set to true, this is used as the empty error message (instead of the default)
               infohelp: '', //optional, help text for the field, which is shown via a tooltip for an info icon, does not apply to type=html||button
               prehelptext: '', //optional, help text for the field which is always displayed, in front of the field
               posthelptext: '', //optional, help text for the field which is always displayed, after the field
               validators: {}, //optional, a validator object. see: http://bootstrapvalidator.votintsev.ru/validators/regexp/ or http://formvalidation.io/validators/, ex: validators: {creditCard: {message: 'Invalid cc value'}}
                                //when required is true or validationtype is used or type is set to daterangepicker||datetimepicker, validators are auto-generated for you,
                                //but any validators that you specify here will override the auto-generated ones
               validationtype: 'Phone', //optional, enum: ['Phone', 'Email', 'URL','PostalCode'], if specified, this will automatically set the proper validators object
               //NOTE: if type:'phone' or type:'email' then validationtype is not necessary
               validationMessage: '', //optional, when validationtype is used or type is set to daterangepicker||datetimepicker, this can be specified to override the default error message
               options: {}, //optional, a raw javascript object,
                //when type=daterangepicker||multiselect||datetimepicker OR validationtype=Phone, this is passed into the jquery constructor for the field
                //see http://davidstutz.github.io/bootstrap-multiselect/
                //see http://www.daterangepicker.com/
                //see http://eonasdan.github.io/bootstrap-datetimepicker/
                //see https://github.com/jackocnr/intl-tel-input/tree/v7.1.0#options
               value: '', //optional, the value or content of this field
               html: '', //optional, the html content, only applies when type=html
               disabled: false, //optional, defaults to false, only applies to fields that can be disabled
               placeholder: '', //optional, a placeholder string for input fields, doesn't apply if validationtype=Phone
               choices: [{text: '', value: ''}], //required when type=radio||checkbox||dropdown||multiselect, an array of text/value pairs, text is required, but value is not (defaults to text)
               multiple: false, //optional, defaults to false, only applies when type=multiselect, determines if multiple selection is allowed
               cols: '50', //optional, when type=textarea this specifies the cols attribute
               rows: '10', //optional, when type=textarea this specifies the rows attribute
               glyphicon: '', //optional, a glyphicon class (ex: glyphicon-minus), when type=button this can be set to add an icon to the button, when type=datetimepicker this can be set to override the default calendar icon
               onclick: function(){}, //optional, when type=button this specifies an onclick function
               htmlAttr: {}, //optional, when type=text||password||textarea||number this can be used to pass a set of html attributes, which will be set on the input element using jquery's attr method
               bindTo: 'fieldname' //this is only available when using CotForm, specify the name or path of a field to bind to, this is not supported if type is 'html', 'button', or 'static'
             }
           ]
         },
         {
          grid: {
             id: 'grid', //an id for the grid
             add: true, //appears to not be in use
             title: 'grid title', //a title for the grid
             headers: [ //an array of objects with title values, for the grid column headings
               {title: 'Heading 1'},
               {title: 'Heading 2'}
             ],
             fields: [ //an array of fields within the current grid
               {
                //the other properties in here are the same as the ones as listed just above
               }
             ]
           }
         }
       ]
     }
   ]
 }