Design > Fields > Bootstrap Input Groups

Bootstrap allows for input groups. Input groups are input fields that can be prepended or appended with:

  • Text
  • Bootstrap Icons
  • Other field inputs

Bootstrap also supports adding buttons - but this is not currently supported in formstrap.

Text and Icons Add Ons

To add text or icons to your input group simply complete the Prepend and Append fields on the field metadata form. Watch this video:

Multi Field Input Group

To group multiple fields together you just need to put them into the same group on the field metadata form for each field. You also need to tick the Add to Input Group checkbox on each field. Watch this video to see how you can create an input group for a full name from a Title drop down select and text inputs for forename and surname:

Although the layout on the editor doesn't change, when you view the group on the live form or preview it looks like this:

As you can see only the label of the first field is used - so you should change this to some more generic e.g.

You might also decide to use placeholders:

Comments

Commenting is temporarily disabled