# ASP.NET Core Button Overview

The Telerik UI Button TagHelper and HtmlHelper for ASP.NET Core are server-side wrappers for the Kendo UI Button widget.

The Button provides a styled clickable UI functionality with arbitrary content. Apart from consistent Kendo UI for jQuery styling, the Button provides keyboard operability for elements, which natively do not have it—for example, `span`.

* [Demo page for the Button HtmlHelper](https://demos.telerik.com/aspnet-core/button/index)

* [Demo page for the Button TagHelper](https://demos.telerik.com/aspnet-core/button/tag-helper)

## Initializing the Button

The following example demonstrates how to define the Button.

```Razor HtmlHelper
@(Html.Kendo().Button()
    .Name("textButton")
    .HtmlAttributes( new {type = "button"} )
    .Content("Text Button")
)
```

```Razor TagHelper
    <kendo-button name="textButton" type="button">Text Button</kendo-button>
```

## Basic Configuration

* The `Name()` configuration method is mandatory as its value is used for the `id` and the `name` attributes of the Button element. Moreover, the `id` is used to properly initialize the Button widget. You can also use the value of the `id` attribute to retrieve the client-side instance of the Button.
* The `Content()` configuration specifies the text that is rendered within the button. This option does not accept HTML, but only string values.
* The `Enable()` option determines whether the widget will be initially enabled (by default) of disabled.
* The `Tag()` method allows the developer to determine whether the widget will be initialized from a `<button>` element (by default), or from an `<a>` element.

The following example demonstrates the available configuration options for the Button.

```Razor HtmlHelper
@(Html.Kendo().Button()
	.Name("textButton")
	.Content("Sample Button")
	.Enable(false)
	.Tag("a")
)

<script type="text/javascript">
    $(function() {
        // The Name() of the Button is used to get its client-side instance.
        var button = $("#textButton").data("kendoButton");
    });
</script>
```

```Razor TagHelper
<kendo-button name="textButton"
              enable="false"
              tag="a">
            Sample Button
</kendo-button>

<script type="text/javascript">
    $(function() {
        // The Name() of the Button is used to get its client-side instance.
        var button = $("#textButton").data("kendoButton");
    });
</script>
```

## Functionality and Features

* [Disabled Button](https://www.telerik.com/aspnet-core-ui/documentation/html-helpers/navigation/button/disabled)—You can render the Button as disabled until certain conditions are met.
* [Icon Button](https://www.telerik.com/aspnet-core-ui/documentation/html-helpers/navigation/button/icons)—The variety of icons allow you to enhance the appearance of the button.
* [Badge Button](https://www.telerik.com/aspnet-core-ui/documentation/html-helpers/navigation/button/badges)—You can add a Badge to the Button to conveniently show its status, a notification, or a short message.
* [Events](https://www.telerik.com/aspnet-core-ui/documentation/html-helpers/navigation/button/events)—The Button allows you to handle its click event and implement custom functionality.

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

## Next Steps

* [Getting Started with the Button](https://www.telerik.com/aspnet-core-ui/documentation/html-helpers/navigation/button/getting-started)

* [Basic Usage of the Button HtmlHelper for ASP.NET Core (Demo)](https://demos.telerik.com/aspnet-core/button/index)

* [Basic Usage of the Button TagHelper for ASP.NET Core (Demo)](https://demos.telerik.com/aspnet-core/button/tag-helper)

* [Button in Razor Pages](https://www.telerik.com/aspnet-core-ui/documentation/html-helpers/navigation/button/razor-page)

## See Also

* [Using the API of the Button for ASP.NET Core (Demo)](https://demos.telerik.com/aspnet-core/button/api)
* [Knowledge Base Section](https://www.telerik.com/aspnet-core-ui/documentation/knowledge-base)
