A jQuery plugin for drag and drop form creation, formBuilder has many options and is translatable.
Example
jQuery(function($) {
var editor = document.getElementById('fb-editor');
$(editor).formBuilder();
});
| Option | Type | Value(s) | Default |
|---|---|---|---|
| actionButtons | {Array} | [{...}] |
[] |
| append / prepend | {Object, Array, String} | DOM Object | [] | '<h1></h1>' |
false |
| controlOrder | {Array} | ['autocomplete', 'button', 'checkbox', ...] |
|
| controlPosition | {String} | 'left' | 'right' |
'right' |
| dataType | {String} | json | xml |
json |
| defaultFields | {Array} | [{type: 'text', name: 'first-name'}] |
[] |
| disabledAttrs | {Array} | array of attributes to disable for all fields | [] |
| disabledActionButtons | {Array} | array of form action buttons to disable | [] |
| disableFields | {Array} | array of field types to disable | ['autocomplete', 'hidden', 'number'] |
| disableInjectedStyle | {Bool} | true | false |
false |
| editOnAdd | {Bool} | true | false |
false |
| fieldRemoveWarn | {Bool} | true |
false |
| fields | {Array} | array of additional field definitions | [] |
| formData | {String} | xmlData |
jsonData |
| inputSets | {Array} | array of field definitions | [] |
| notify | {Object} | {error: message => alert(message)} |
See config.js#L47 |
| onSave | {Function} | (evt, formData) => {} |
See config.js#L52 |
| onClearAll | {Function} | () => {} |
See config.js#L53 |
| roles | {Object} | {'admin': 'Administrator', 'editor': 'Editor' } |
{ 1: 'Administrator'} |
| showActionButtons | {Bool} | showActionButtons: false |
true |
| sortableControls | {Bool} | sortableControls: true |
false |
| stickyControls | {Object} | stickyControls: {enable:true, offset: { top: 5, bottom: 'auto', right: 'auto' }} |
stickyControls: {enable:true} |
| templates | {Object} | Additional field templates | {} |
| typeUserAttrs | {Object} | typeUserAttrs config | null |
| typeUserDisabledAttrs | {Object} | typeUserDisabledAttrs config | null |
| typeUserEvents | {Object} | typeUserEvents config | null |
| Option | Type | Value(s) | Default |
|---|---|---|---|
| locale | {String} | user's locale eg. 'pt-BR' | 'en-US' |
| location | {String} | url of language directory | 'https://formbuilder.online/assets/lang/' |
| extension | {String} | '.ext' | '.lang' |
| preloaded | {Object} | {} |
{'en-US': {...}} |
As formBuilder usage grows so does it's need to be available in multiple languages. Additional and updates to existing languages are always welcome, see Contributing Languages for details.