# ASP.NET MVC SegmentedControl Overview

The Telerik UI SegmentedControl HtmlHelper for ASP.NET MVC is a server-side wrapper for the Kendo UI SegmentedControl component.

The SegmentedControl renders a group of buttons that allow the user to select a single option from a set of mutually exclusive choices. Each button represents one segment and can display a text label, an icon, or both.

* [Demo page for the SegmentedControl](https://demos.telerik.com/aspnet-mvc/segmentedcontrol/index)

## Initializing the SegmentedControl

The following example demonstrates how to initialize the SegmentedControl.

```Razor HtmlHelper
@using Kendo.Mvc.UI

@(Html.Kendo().SegmentedControl()
    .Name("segmentedControl")
    .Items(items =>
    {
        items.Add().Text("Option 1").Value("option1");
        items.Add().Text("Option 2").Value("option2");
        items.Add().Text("Option 3").Value("option3");
    })
    .SelectedValue("option1")
)
```

## Functionality and Features

* [Getting Started](https://www.telerik.com/aspnet-mvc/documentation/html-helpers/navigation/segmentedcontrol/getting-started)—Follow a step-by-step tutorial to set up the SegmentedControl for the first time.
* [Layout Modes](https://www.telerik.com/aspnet-mvc/documentation/html-helpers/navigation/segmentedcontrol/layout-modes)—Choose between `Compact` mode, where each segment sizes to its content, and `Stretch` mode, where all segments share the container width equally.
* [Icons](https://www.telerik.com/aspnet-mvc/documentation/html-helpers/navigation/segmentedcontrol/icons)—Enhance segment buttons with icons from the Kendo UI theme, custom CSS classes, or a combination of icons and text labels.
* [Events](https://www.telerik.com/aspnet-mvc/documentation/html-helpers/navigation/segmentedcontrol/events)—Handle the `Change` event to execute custom logic when the user selects a different segment.
* [Keyboard Navigation](https://www.telerik.com/aspnet-mvc/documentation/html-helpers/navigation/segmentedcontrol/accessibility/keyboard-navigation)—The SegmentedControl supports keyboard navigation for moving focus between buttons and activating the selected segment.

> tip To learn more about the appearance, anatomy, and accessibility of the SegmentedControl, visit the [Progress Design System documentation](https://www.telerik.com/design-system/docs/components/segmentedcontrol/)—an information portal offering rich component usage guidelines, descriptions of the available style variables, and globalization support details.

## Next Steps

* [Getting Started with the SegmentedControl for ASP.NET MVC](https://www.telerik.com/aspnet-mvc/documentation/html-helpers/navigation/segmentedcontrol/getting-started)
* [Basic Usage of the SegmentedControl HtmlHelper for ASP.NET MVC (Demo)](https://demos.telerik.com/aspnet-mvc/segmentedcontrol/index)
* [Server-Side API of the SegmentedControl HtmlHelper for ASP.NET MVC](https://www.telerik.com/aspnet-mvc/documentation/api/segmentedcontrol)
* [JavaScript API Reference of the SegmentedControl](https://docs.telerik.com/kendo-ui/api/ui/segmentedcontrol)

## See Also

* [Applying the SegmentedControl API (Demo)](https://demos.telerik.com/aspnet-mvc/segmentedcontrol/api)
* [Basic Events in the SegmentedControl (Demo)](https://demos.telerik.com/aspnet-mvc/segmentedcontrol/events)
* [Knowledge Base Section](https://www.telerik.com/aspnet-mvc/documentation/knowledge-base)