change

Fires when the user selects a table row in the PropertyGrid. The event handler function context (available through the this keyword) will be set to the component instance.

Event Data

e.sender kendo.ui.PropertyGrid

The component instance which fired the event.

Example - getting the selected data item from the selected row

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

<script>
  $("#propertyGrid").kendoPropertyGrid({
    model: {
        details: {
            title: "Title",
            price: 15
        },
        foo: "bar",
        baz: 5
    },
    width: 500,
    change: function(e) {
      var selectedRow = this.selectItem();
      var dataItem = this.dataItem(selectedRow);
      /* The result can be observed in the DevTools(F12) console of the browser. */
      console.log(`field: ${dataItem.field}: value: ${dataItem.value}`);
    }
  });
</script>
In this article