Form Stubs

A form stub is a short form that is intended to feed into a larger form. A form stub will not be validated for any errors and any information submitted will not be saved in the database.

An example would be that you have a quote request form that is long. You could have a short form located on other pages of the site that only have the first name, last name, phone and email fields. That form would be submitted to the URL of the page where the full form lives. The data submitted should be used to pre-populate the larger form.

In order to create a form stub you need to include the following hidden form fields within the <form> tags:

<input type="hidden" name="apFormStub" value="1">

Within your form template you would use the {form.stub }} tag to output that hidden form field.

Form stub template

The form template for the form stub would be created under the "Form Templates" part of the Forms app.

Do not create a separate form for the form stub.  You use the same form that the form stub feeds into and simply use a different template to display the form stub.

You will need to specify the form action. The form action should be the URL of the page that the larger form lives on. 

Example form template

Below is an example form stub template for a larger contact form. In this case, we only want to show the 'First Name', 'Last Name' and 'Email' fields. When this form is submitted to the page that holds the whole form those three fields will be populated.

The  {{ form.stub }} tag is required.

{# Set the action for the form to point to the correct page where the full form is at #}
{% set form.action = '/contact' %}

{{ form.openTag }}
    {{ form.stub }}
   
    {# field names for the fields that we want for this form #}
    {% set fieldsToUse = ['first-name', 'last-name', 'email-address'] %}

    {# Loop through and show each form field if it's one of the fields to use #}
    {% for field in form.fields %}
        {% if field.name in fieldsToUse %}
            {# This field is one of the fields to use #}
            <p>
                {{ form.fields.firstName.label.tag }}<br>
                {{ field.tag }}
            </p>
        {% endif %}
    {% endfor %}
   
    <p><button type="submit">{{ form.submitButtonText }}</button></p>
{{ form.closeTag }}

Or, you could manually output the form fields.

{% set form.action = '/contact' %}
{{ form.openTag }}
    {{ form.stub }}

    <p>
        {{ form.fields.firstName.label.tag }}<br>
        {{ form.fields.firstName.tag }}
    </p>
    <p>
        {{ form.fields.lastName.label.tag }}<br>
        {{ form.fields.lastName.tag }}
    </p>

    <p><button type="submit">{{ form.submitButtonText }}</button></p>
{{ form.closeTag }}

Displaying the form stub

To display the form stub on your page you will use the same form API tag as you would for the regular form with the addition of the template parameter to specify which form template to use. For example, say that your form is called "Contact" with a form key of "contact". And let's say that you created a new form template and the template key is "contact-stub". Below is the form API tab that you would use.

{{ _api.form.get.key('contact').template('contact-stub') }}

Place that API tag in your template or within the page content where you want the form displayed.