New to Telerik UI for ASP.NET Core? Download free 30-day trial

Disabled Button

The business logic of an application often requires a certain button to be temporarily disabled or enabled.

You can initially configure the Button as disabled through its .Enable() setting. additionally, you can enable or disable the button at any time with javascript by using its enable() method with a Boolean argument.

The following example demonstrates how to enable and disable the Button through the enable attribute.

        .Content("Disabled button"))
    <kendo-button name="disabledButton" enable="false">Disabled button</kendo-button>

To disable the Button, you can also use the ViewData or ViewBag attributes. The example below illustrates a disabled Button through the ViewData attribute.

        .Content("Disabled button"))
    <kendo-button name="disabledButton" enable='(bool)@ViewData["IsEnabled"]'>Disabled button</kendo-button>
    public IActionResult Index()
        ViewData["IsEnabled"] = false;
        return View();

At runtime, you can disable the Button at with JavaScript by using its enable() method with a Boolean argument.

    <kendo-button name="editButton">Edit</kendo-button>
        var isAdmin = false;
        var buttonWidget = $("#editButton").data("kendoButton"); // Use the [``]( configuration option to get an instance of the Button TagHelper
        if(!isAdmin) {
            buttonWidget.enable(false); // disable the button
        } else {
            buttonWidget.enable(true);  // enable the button

Referencing Existing Instances

To reference an existing Button instance, use the configuration option. Once a reference is established, use the Button client-side API.

See Also

In this article