UI Widgets Button

A button widget.

Type: Object

The main purpose of the dxButton widget is to perform a specified action when the button is clicked. Declare a function that handles the button click and pass it to the clickAction configuration option.

var buttonClicked = function(e){
    alert("The button is clicked");

To create the dxButton widget, add a div element with dxButton Knockout binding within the body of the required view.

<div data-bind="dxButton: { text: 'Click me', clickAction: buttonClicked }"></div>

Refer to the Add a widget documentation section to learn how to create widgets in detail.

Show Example:
<div class="button" data-bind="dxButton:{text:'Click me', clickAction: buttonClicked}"></div>
buttonClicked = function(){
    DevExpress.ui.notify("The button is clicked", "success", 1000);
body {
    text-align: center;
    margin-top: 25px;


An object defining configuration options for the dxButton widget.


This section describes methods that can be used to manipulate a widget.


This section describes events fired by this component.