cancel

Fires when the user closes the edit cell via the Esc key or when the Reset command from the ContextMenu is executed. The event handler function context (available through the this keyword) will be set to the component instance.

Event Data

e.container jQuery

The jQuery object that represents the edit form container element.

e.model kendo.data.TreeListModel

The data item to which the table row is bound.

e.preventDefault Function

If invoked, prevents the cancel action. The table row remains in edit mode.

e.sender kendo.ui.PropertyGrid

The component instance which fired the event.

Example - subscribing to the cancel event before initialization

<div id="propertyGrid"></div>

<script>
  $("#propertyGrid").kendoPropertyGrid({
    model: {
        details: {
            title: "Title",
            price: 15
        },
        foo: "bar",
        baz: 5
    },
    width: 500,
    cancel: function(e) {
      /* The result can be observed in the DevTools(F12) console of the browser. */
      console.log("cancel");
    }
  });
</script>

Example - subscribing to the cancel event after initialization

<div id="propertyGrid"></div>

<script>
  function cancel(e) {
    /* The result can be observed in the DevTools(F12) console of the browser. */
    console.log("cancel");
  }

  $("#propertyGrid").kendoPropertyGrid({
    model: {
        details: {
            title: "Title",
            price: 15
        },
        foo: "bar",
        baz: 5
    },
    width: 500
  });

    var component = $("#propertyGrid").data("kendoPropertyGrid");
    component.bind("cancel", cancel);
</script>
In this article