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.
@(Html.Kendo().Button()
.Name("disabledButton")
.Enable(false)
.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.
@(Html.Kendo().Button()
.Name("disabledButton")
.Enable((bool)@ViewData["IsEnabled"])
.Content("Disabled button"))
<kendo-button name="disabledButton" enable='(bool)@ViewData["IsEnabled"]'>Disabled button</kendo-button>
public ActionResult 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.
@(Html.Kendo().Button()
.Name("editButton")
.Content("Edit")
<kendo-button name="editButton">Edit</kendo-button>
<script>
var isAdmin = false;
var buttonWidget = $("#editButton").data("kendoButton"); // Use the [`jQuery.data()`](http://api.jquery.com/jQuery.data/) 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
}
</script>
Referencing Existing Instances
To reference an existing Button instance, use the jQuery.data() configuration option. Once a reference is established, use the Button client-side API.