This article explains how to handle advanced use cases with CRM forms.

Add the same form multiple times on a page

Copy the form code and paste it anywhere on your page.

Use a CRM form and a widget on the same page

You can use both on the same page. Copy the CRM form code and insert it wherever you need it.

Add multiple contact forms to one page

Copy the form code and paste it wherever you need it on the page.

Set up autocomplete for hidden fields

Add a hidden field to your CRM form and assign a default value, such as %test%.
Default values for hidden fields in CRM forms

Use a script to assign values dynamically. For example: form.setProperty("test", "567"). Here, test is the hidden field name, and 567 is the value sent to the CRM.

If your form has multiple hidden fields, add a line for each field.

Add this script to your site:

 
<script>
window.addEventListener('b24:form:init', (event) => {
    let form = event.detail.object;
        form.setProperty('test', '567');
      });
</script>

This script applies to all forms that include the specified hidden field.

To target a specific form, add its ID to the script. For example, for form ID 14:

 
<script>
window.addEventListener('b24:form:init', (event) => {
    let form = event.detail.object;
    /*if (form.identification.id == 14) {
          form.setProperty("test", "567");
    }*/
});
</script>

Place the script on your site before you add the form to ensure the data is passed correctly.

Set field values for all widgets on a page

Add this script to the page before you connect the widget:

<script>
window.addEventListener('b24:form:init', (event) => {
    let form = event.detail.object;
    form.setValues({
        "name": "Michael",
        "last-name": "Wilson",
        "email": "michael@example.com",
        "phone": "+11234567890"
    });
});
</script>