actions Array

A collection of objects containing text, action and primary attributes used to specify the dialog buttons.

Example

<div id="dialog"></div>
<script>
    $("#dialog").kendoDialog({
      title: "Kendo Dialog Component",
      content: "This is your Kendo Dialog.",
      actions: [{
          text: "OK",
          action: function(e){
              // e.sender is a reference to the dialog widget object
              // OK action was clicked
              // Returning false will prevent the closing of the dialog
              return false;
          },
          primary: true
      },{
          text: "Cancel"
      }]
    });
</script>

actions.text String

The text to be shown in the action's button.

Example

<div id="dialog"></div>
<script>
    $("#dialog").kendoDialog({
      title: "Kendo Dialog Component",
      content: "This is your Kendo Dialog.",
      actions: [{
          text: "OK",
      }]
    });
</script>

actions.action Function

The callback function to be called after pressing the action button.

Example

<div id="dialog"></div>
<script>
    $("#dialog").kendoDialog({
      title: "Kendo Dialog Component",
      content: "This is your Kendo Dialog.",
      actions: [{
          text: "OK",
          action: function(e){
              // e.sender is a reference to the dialog widget object
              alert("OK action was clicked");
              // Returning false will prevent the closing of the dialog
              return true;
          },
      }]
    });
</script>

actions.primary Boolean

A boolean property indicating whether the action button will be decorated as primary button or not.

Example

<div id="dialog"></div>
<script>
    $("#dialog").kendoDialog({
      title: "Kendo Dialog Component",
      content: "This is your Kendo Dialog.",
      actions: [{
          text: "OK",
          primary: true
      }]
    });
</script>

actions.cssClass String

Adds a custom class to the action button.

Example

<div id="dialog"></div>
<script>
    $("#dialog").kendoDialog({
      title: "Kendo Dialog Component",
      content: "This is your Kendo Dialog.",
      actions: [{
          text: "OK",
          primary: true,
          cssClass: "myClass"
      }]
    });
</script>

  <style>
      .myClass{
          background-color: green !important;
      }
  </style>
In this article