Travis Tidwell edited this page Mar 25, 2017 · 12 revisions

Installing the library.

To install this library within your application, you can use the following.

npm install --save formiojs

Full Developer SDK Documentation

To view the full SDK Documentation, go to Developer SDK Documentation

Components

You can then include The following major components within your application.

  • JavaScript API - This component allows you to easily communicate to the Form.io API's from within your JavaScript application, like so.

    import Formio from 'formiojs';
    let formApi = new Formio('https://examples.form.io/example');
    formApi.loadForm().then(function(form) {
      console.log(form)
    });
  • Form Renderer - This is the core form rendering library which renders a Form.io JSON form schema within your page.

    import FormioForm from 'formiojs/form';
    let form = new FormioForm(document.getElementById('formelement'));
    form.src = 'https://examples.form.io/example';
  • Form Wizard - This allows you to render a wizard within your application.

    import FormioWizard from 'formiojs/wizard';
    let form = new FormioWizard(document.getElementById('formelement'));
    form.src = 'https://examples.form.io/wizard';
  • Form Embedding - Allows you to embed a form within your application by including a single script tag as follows.

    <script src="https://unpkg.com/formiojs@latest/dist/formio.embed.min.js?src=https://examples.form.io/example"></script>
  • Form Utilities - This is a Utility javascript library that offers some common utilities within your application.

    import Formio from 'formiojs';
    import FormioUtils from 'formiojs/utils';
    
    let form = new Formio('https://examples.form.io/example');
    form.loadForm().then((form) => {
      FormioUtils.eachComponent(form.components, (component) => {
        console.log(component);
      });
    });
You can’t perform that action at this time.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session.
Press h to open a hovercard with more details.