Overview

The Button widget is a simple button that performs specified commands when a user clicks it.

View Demo

The following code adds a simple Button to your page.

HTML
<div id="buttonContainer"></div>
JavaScript
$(function () {
    $("#buttonContainer").dxButton({
        text: "OK",
        onClick: function (e) { 
            DevExpress.ui.notify("The OK button was clicked");
        }
    });
});

In the previous code, the click event is handled using the onClick option. Alternatively, you can attach one or several handlers to this event using the on(eventName, eventHandler) method.

JavaScript
var clickHandler1 = function (e) {
    // First handler of the "click" event
};

var clickHandler2 = function (e) {
    // Second handler of the "click" event
};

$("#buttonContainer").dxButton("instance")
    .on('click', clickHandler1)
    .on('click', clickHandler2);

The appearance of the Button is predefined by its type. Find more on this and other properties that impact the widget appearance in the Customize the Appearance article.

See Also