• Getting Started
  • Components
    • Barcodes
    • Buttons
    • Chartsupdated
    • Conversational UIupdated
    • Data Query
    • Date Inputs
    • Date Math
    • Dialogs
    • Drawing
    • Dropdownsupdated
    • Editor
    • Excel Export
    • File Saver
    • Filter
    • Gantt
    • Gauges
    • Gridupdated
    • Icons
    • Indicators
    • Inputsupdated
    • Labels
    • Layout
    • ListBox
    • ListView
    • Map
    • Menus
    • Navigation
    • Notification
    • Pager
    • PDF Export
    • PDFViewer
    • PivotGrid
    • Popup
    • ProgressBars
    • Ripple
    • Schedulerupdated
    • ScrollView
    • Sortable
    • Spreadsheetupdated
    • ToolBar
    • Tooltips
    • TreeList
    • TreeView
    • Typography
    • Uploads
    • Utilities
  • Styling & Themes
  • Common Features
  • Project Setup
  • Knowledge Base
  • Sample Applications
  • FAQ
  • Troubleshooting
  • Updates
  • Changelogs
New to Kendo UI for Angular? Start a free 30-day trial

ButtonGroupComponent

Represents the Kendo UI ButtonGroup component for Angular.

Selector

kendo-buttongroup

Export Name

Accessible in templates as #kendoButtonGroupInstance="kendoButtonGroup"

Inputs

NameTypeDefaultDescription

disabled

boolean

By default, the ButtonGroup is enabled. To disable the whole group of buttons, set its disabled attribute to true.

To disable a specific button, set its own disabled attribute to true and leave the disabled attribute of the ButtonGroup undefined. If you define the disabled attribute of the ButtonGroup, it will take precedence over the disabled attributes of the underlying buttons and they will be ignored.

For more information on how to configure the Button, refer to its API documentation.

navigable

boolean

true

When this option is set to true (default), the component is a single tab-stop, and focus is moved through the inner buttons via the arrow keys.

When the option is set to false, the inner buttons are part of the natural tab sequence of the page.

selection

ButtonGroupSelection

'multiple'

The selection mode of the ButtonGroup.

tabIndex

number

Specifies the tabIndex of the component.

width

string

Sets the width of the ButtonGroup. If the width of the ButtonGroup is set:

  • The buttons resize automatically to fill the full width of the group wrapper.
  • The buttons acquire the same width.

Events

NameTypeDescription

navigate

EventEmitter<PreventableEvent>

Fires every time keyboard navigation occurs.

In this article

Not finding the help you need?