ButtonGroup JSP Tag Overview
The ButtonGroup JSP tag is a server-side wrapper for the Kendo UI ButtonGroup widget.
Getting Started
Make sure you are familiar with some of the fundamental Kendo UI widget concepts and that the Kendo UI Java wrappers are set up correctly.
The Basics
The ButtonGroup widget groups a series of buttons together on a single line.
Initialization
The example below demonstrates how to initialize the ButtonGroup by using the default buttongroup
tag.
<kendo:buttonGroup name="select-period">
<kendo:buttonGroup-items>
<kendo:buttonGroup-item text="Month">
</kendo:buttonGroup-item>
<kendo:buttonGroup-item text="Quarter">
</kendo:buttonGroup-item>
<kendo:buttonGroup-item text="Year">
</kendo:buttonGroup-item>
</kendo:buttonGroup-items>
</kendo:buttonGroup>
Features
Enable and Disable ButtonGroup
You can configure the ButtonGroup to be initially disabled by using its enable
property. The ButtonGroup can also be disabled or enabled at any time with JavaScript by using the enable()
method with a Boolean argument. For more information on the enable
method of the ButtonGroup, refer to the ButtonGroup API.
The following example demonstrates how to enable and disable the ButtonGroup.
<kendo:buttonGroup name="select-period" enable="false">
<kendo:buttonGroup-items>
<kendo:buttonGroup-item text="Month">
</kendo:buttonGroup-item>
<kendo:buttonGroup-item text="Quarter">
</kendo:buttonGroup-item>
<kendo:buttonGroup-item text="Year">
</kendo:buttonGroup-item>
</kendo:buttonGroup-items>
</kendo:buttonGroup>
Index
To configure the initially selected index of the ButtonGroup, use its index
property. An index can also be selected over the select()
method with an Integer argument. For more information on the select
method of the ButtonGroup, refer to the ButtonGroup API.
The following example demonstrates how to select a button by its index.
<kendo:buttonGroup name="align" selection="single" index="0">
<kendo:buttonGroup-items>
<kendo:buttonGroup-item icon="align-left">
</kendo:buttonGroup-item>
<kendo:buttonGroup-item icon="align-center">
</kendo:buttonGroup-item>
<kendo:buttonGroup-item icon="align-right">
</kendo:buttonGroup-item>
</kendo:buttonGroup-items>
</kendo:buttonGroup>
Reference
Existing Instance
To reference an existing ButtonGroup instance, refer to the introductory article on the ButtonGroup.