Entire Sections
Use these attributes when you want to duplicate an entire section of a form that includes multiple inputs.
For instance, you can use them to "Add another family member" or "Add another address."
Wrapper Element
A "wrapper element" is a Div block that holds the form section you want to duplicate when a user clicks a button. The copied section is appended to this Div block.
The value assigned to the "name" can be chosen freely, but it's crucial to maintain consistency. This "name" value serves as an identifier, grouping together related attributes, and distinguishing clone instances within the form.
Clone Section
This section of the form contains the content you want to duplicate. All input elements within this Div Block will be copied, and each input's name will have an index value added to the end.
For instance, "name-1" and "email-1" are examples of how the input names will appear after cloning.
"Add Another" Button
Add this attribute to the button that will trigger the duplication of the section.
Delete Cloned Section Button
To allow users to remove the cloned form section, add this attribute to a Button, Div Block or Link Block.
Display Cloned Data Wrapper
If you want to display the user's input data, add this attribute to a Div Block that will be the wrapper for all the cloned data. The cloned summary block will be appended into this Div.
Display Cloned Data Item
If you want to display the user's input data, add this attribute to the Div Block along with the attributes from the Get User Input feature.
Check out the cloneable to see how this is done.
Index Value (On Form)
This attribute automatically assigns the appropriate index value to any headings or text you wish to include. For example, it can be used to display "Address 1," "Address 2," or "Team Member 1," "Team Member 2," and so on.
Index Value (On Summary Card)
This attribute automatically assigns the appropriate index value to any headings or text you wish to include.
Index Value (On Summary Card)
This attribute automatically assigns the appropriate index value to any headings or text you wish to include.
Dynamic Input Cloneable
Clone this example to quickly start building.
Clone Individual Input
If you wish to duplicate a single input field in a form, follow the following attributes.
Example: "Add another email" or "Add another name.
Wrapper
A "wrapper element" is a Div block that holds the input and label you want to duplicate when a user clicks a button. The duplicated inputs are appended to this Div block.
The value assigned to the "name" attribute can be chosen freely, but it's crucial to maintain consistency. This "name" value serves as an identifier, grouping together related attributes, and distinguishing clone instances within the form.
Clone Input
This Div Block should contain the input and label you want to duplicate. All input elements within this Div Block will be copied, and each input's name will have an index value added to the end.
For instance, "name-1" and "email-1" are examples of how the input names will appear after cloning.
"Add Another Input" Button
Add this attribute to the button that will trigger the duplication of the input.
Remove Input Button
To allow users to remove the cloned form section, add this attribute to a Button, Div Block or Link Block.
Display Cloned Input Wrapper
If you want to display the user's input data, add this attribute to a Div Block that will be the wrapper for all the cloned input. The cloned summary block will be appended into this Div.
Display Cloned Inputs
If you want to display the user's input data, add this attribute to the Div Block along with the attributes from the Get User Input feature.
Check out the cloneable to see how this is done.
Dynamic Input Cloneable
Clone this example to quickly start building.
Join our awesome Slack community with over 300+ Webflow users!
Seek support, vote on new features, stay updated and network with other community members.