Edit on Github

ButtonToolbar

in namespace DotVVM.Framework.Controls.Bootstrap4

Combines ButtonGroups or InputGroups into button toolbars.

Usage & Scenarios

Render a Bootstrap button toolbar which consists of one or more ButtonGroup or InputGroup controls.

https://getbootstrap.com/docs/4.3/components/button-group/#button-toolbar

Sample 1: ButtonToolbar Usage

Place ButtonGroup or InputGroup controls inside the toolbar element.

The HorizontalAlignment property allows to specify the alignment for the toolbar content.

  • Start aligns the items to the left.
  • Center aligns the items to the middle.
  • End aligns the items to the right.
  • Around distributes the remaining space equally around every items.
  • Between distributes the remaining space equally in the gaps between items.
<bs:ButtonToolbar>
  <bs:ButtonGroup>
    <bs:Button Text="Button 1" Type="Primary" />
    <bs:Button Text="Button 2" Type="Secondary" />
  </bs:ButtonGroup>
  <bs:InputGroup>
    <LeftTemplate>
      <bs:InputGroupLiteral Text="@" />
    </LeftTemplate>
    <ContentTemplate>
      <bs:InputGroupTextBox Text="" />
    </ContentTemplate>
  </bs:InputGroup>
</bs:ButtonToolbar>

Properties

Name Type Description Notes Default Value
property icon Items List<IButtonToolbarItem> Gets or sets the contents of the button toolbar.
attribute
inner element
static value
bindable
default
 null

HTML produced by the control