formBuilder v2.9.8

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();
});

Demo

Options

General

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

i18n

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': {...}}`

Angular 2/4 Version

Changelog

Translators Needed!

As formBuilder usage grows so does it's need to be available in multiple languages. Additions and updates to existing languages are always welcome, see Contributing Languages for details.

bjoxiah/formBuilder