ButtonGroup Selection Mode
The ButtonGroup provides options for setting how many Buttons users can select at once. Use its selection input, which accepts single or multiple (default).
Set the Button toggleable property to true for each Button that users can select. The property defaults to false. For more information on persisting the selected Buttons within a collection, refer to Buttons Collection.
The following example demonstrates the single and multiple selection modes.
Default Selection
To preselect a Button, set its selected property to true. In single selection mode, preselect at most one Button. Otherwise, the ButtonGroup throws an error in development mode.
<kendo-buttongroup selection="single">
<button kendoButton [toggleable]="true" [selected]="true">Left</button>
<button kendoButton [toggleable]="true">Center</button>
</kendo-buttongroup>
Single Selection
In single selection mode, selecting a Button deselects the previously selected one. Selecting the already selected Button keeps it selected.
<kendo-buttongroup selection="single">
<button kendoButton [toggleable]="true">Left</button>
<button kendoButton [toggleable]="true">Center</button>
</kendo-buttongroup>
Multiple Selection
In the default multiple selection mode, users select or deselect each toggleable Button independently.
<kendo-buttongroup selection="multiple">
<button kendoButton [toggleable]="true">Bold</button>
<button kendoButton [toggleable]="true">Italic</button>
</kendo-buttongroup>