myFormioDemo

My project to learn to use the form.io renderer and builder components.

This project was previously named ngFormBuilder. But the target of the project is to learn all available “free to use” Form.io components. Not only the builder, but also the renderer and maybe PDF.

The IntelliJ project is placed in /mnt/sda4/development/workspaces.new/myFormioDemo.

• Angular Form.io Demo
  • Form.io Renderer
  • Form.io Builder

Here is the list of all UI-elements which are implemented by surveylib (but not necessarily by the Avril app ⇒ check?):

• Button
  • Form.io
    • “type”: “button”
• Checkbox
  • Form.io
    • “type”: “checkbox”
• Component
  • Form.io
    • Layout/Content?
    • Data/Container?
• Content
  • Form.io
    • “type”: “content”
• Currency
  • Form.io
    • “type”: “currency”
• DateTime
  • Form.io
    • “type”: “datetime”
• Day
  • Form.io
    • “type”: “day”
• EditGrid
  • Form.io
    • “type”: “textarea” ?
• FieldSet
  • Form.io
    • “type”: “fieldset”
  • it can contain nested elements ⇒ not really necessary to implement in the first version
• File
  • Form.io
    • “type”: “file”
• HtmlElement
  • Form.io
    • “type”: “htmlelement” ?
• Number
  • Form.io
    • “type”: “number”
• Panel
  • Form.io
    • “type”: “panel”
  • can contain embedded elements
  • ⇒ it is not really necessary to implement it now
• PhoneNumber
  • Form.io
    • “type”: “phoneNumber”
• Photo
  • Form.io
    • form.io have it only in non-free commercial version
  • ⇒ it should be implemented by my own
• Radio
  • “type”: “radio”
• Resource
  • Form.io
    • not available ?
• Select
  • Form.io
    • “type”: “select”
• Selectboxes
  • Form.io
    • “type”: “selectboxes”
• Signature
  • Form.io
    • “type”: “signature”
• TextArea
  • Form.io
    • “type”: “textarea”
• TextField
  • Form.io
    • “type”: “textfield”
• Time
  • Form.io
    • “type”: “time”

The surveylib defines following elements which can be used:

• Checkbox
• Content
• DateTime
• Day
• EditGrid
• HtmlElement
• Number
• Photo
• Radio
• Signature
• TextArea
• TextField
• Time

So currently not available are:

• Button
• Component
• Currency
• FieldSet
• File
• Panel
• PhoneNumber
• Resource
• Select
• Selectboxes

• https://github.com/formio/formio.js - Github project of “Vanilla JS” form.io
  • Examples
    • Builder Demo
    • PDF (→ use Chrome for it)

• https://github.com/formio/angular - Github project of form.io for Angular

• Developer Docs
  • https://help.form.io/developers/introduction
  • https://help.form.io/developers/form-development/form-builder

• https://github.com/formio/ngFormBuilder - Builder
  • Drag and Drop Angular.js(!)-based form builder
  • Creates JSON, which describes the survey form
  • Demo

• https://github.com/formio/ngFormio - Renderer

• FormBuilder
  • formBuilder.online - Demo
  • jQuery plugin
• Alpaca Forms - Easy Forms for jQuery (Form Builder Demo)
  • nice
  • js only
  • seems to be outdated
    • latest version 2019?
• JSONForms
  • Angular or React renderers possible
  • https://github.com/eclipsesource/jsonforms-editor → JSONForms Editor Demo
• shalotelli/form_builder
  • latest version from 2014
• https://formtools.org/
  • nice, but PHP/MySQL script
• Best Angular Forms libraries - a list
• Top 5 best drag and drop form builders plugins for JavaScript and jQuery - a list
• 5 best open source form builder apps (tried and tested)

• Best Free and Open Source Web Form Generator
  • Form.io
    • https://github.com/formio/formio
  • Orbeon
    • https://github.com/orbeon/orbeon-forms
  • OhMyForm
    • https://github.com/ohmyform/ohmyform
  • Webiny
    • https://github.com/webiny/webiny-js
  • FormTools
    • https://github.com/formtools/core
  • FormBuilder
    • https://github.com/kevinchappell/formBuilder
    • https://formbuilder.online/
  • Alpaca Forms
    • https://github.com/gitana/alpaca
    • http://www.alpacajs.org/