Getting started

To get started integrating with an embedded form, you may access the FormsApi instance using:

var formsApi = window.limeForms.getApi();

This will retrieve the FormsApi instance for the first lime-form or simpli-form element it finds.

If you have multiple forms embedded on the same page, you may pass the form-id to the getApi function to retrieve the FormsApi instance for that specific form.

Say you have multiple forms embedded, but you specifically want to integrate with a "contact us" form you have embedded:

var contactUsFormId = 'onQwutompje2d0B8Ker0';
var contactUsFormApi = window.limeForms.getApi(contactUsFormId);

If the loading of the form javascript is delayed on the page where the form is embedded it is recommended to listen for the "form ready" event for the specific form before trying to fetch js api

var contactUsFormId = 'aEwonQupje2d318Kqv7';

window.addEventListener('lime-forms-ready', (event) => {
    // If multiple forms embedded on the same page: check that the correct form id is in event details
    if (event.detail.formId == contactUsFormId) {
        const apiContactUsForm = window.limeForms.getApi(contactUsFormId);
        apiContactUsForm.onReady(function() {
            apiContactUsForm.setFieldValue('field_name', 'value');
            ...
        });
    }
});

Once you have retrieved the FormsApi, you must wait until the forms is ready and initialized:

var formsApi = window.limeForms.getApi();
formsApi.onReady(function() {
    // you may now start integrating with the form

    console.log('--- lime forms running on v' + formsApi.version + ' ---');
});

You have the ability to use axios https://github.com/axios/axios through formsApi.http.

formsApi.onReady(() => {
    formsApi.http({
      method: 'post',
      url: 'https://externalsystem.com/fetch-value/',
      data: {
        id: '1001'
      }
    }).then((response) => {
        formsApi.setFieldValue('external_data', response.data); 
  });
});