Embedded Forms

1. Form definition

Form are based on Alpaca (as all forms in OpenContent).
The definition is stored in form-schema.json and form-options.json.
This accessible from Edit Template Files.
If a form definition file exist a new item is created Form Settings with the notification settings.

2. Load needed javascript and css

Load Alpaca and Handlebars

{{registerform "bootstrap"}}

The parameter is the layout : bootstrap or web.

3. Include Form in template

In you template you need to create a empty div with a id.

<div id="alpacaForm"></div>

In the javascript you need to create the form.

var sf = $.ServicesFramework(moduleId);
$("#alpacaForm").openContentForm({
    servicesFramework: sf,
    onSubmited: function () {
      // execute some code after submit
    }
});

You can also do some additional things with the form

// submit the form to the server
$("#alpacaForm").openContentForm().submit();
// modify a field of the form
$("#alpacaForm").openContentForm().setField("Name", "John");
// after submit the form is hidden, sso you can show it again
$("#alpacaForm").openContentForm().show();