draggable/formeo

Drag and Drop Javascript form builder

v1.7.0 2024-10-18 01:36 UTC

MIT

• Kevin Chappell

• form
• builder
• formbuilder
• form builder

README

A pure JavaScript module for drag and drop form creation.

Demo

Features

• Drag & drop editing
• Extensible builder with plethora of options
• Column/inline fields
• Custom fields
• Preview mode
• i18n support

Installation

NPM

npm install --save formeo

Manual

<script src="https://draggable.github.io/formeo/assets/js/formeo.min.js"></script>

Usage

To start building forms with this module include formeo.min.js and formeo.min.css in your project and call:

import { FormeoEditor, FormeoRenderer } from 'formeo'

// Set up a form builder
const editor = new FormeoEditor(options)

// When you're ready, grab the form data object
// Typically you'd do this in the "onSave" event, which you can configure through the editor's options object
const formData = editor.formData

// Then, when you're ready to render the form, use
const renderer = new FormeoRenderer(options)
renderer.render(formData)

Docs

Changelog