eyep
eyep

Reputation: 13

Kendo JQuery Grid dataBound event not rasing

In Kendo JQuery Grid, I'm not being able to get dataBound event work event in this trivial example. However, the dataBinding event is fired as expected. What I'm doing wrong?

Can't find any meaningful difference compared with the Telerik grid event demo. https://demos.telerik.com/kendo-ui/grid/events

Any hint will be greatly appreciated.

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <link href="kendo/content/shared/styles/examples-offline.css" rel="stylesheet">
    <link href="kendo/styles/kendo.common.min.css" rel="stylesheet">
    <link href="kendo/styles/kendo.default.min.css" rel="stylesheet">
    <link href="kendo/styles/kendo.default.mobile.min.css" rel="stylesheet">
     <script src="kendo/js/jquery.min.js"></script>
    <script src="kendo/js/kendo.all.min.js"></script>
    <title></title>
</head>
<body>
    <div id="grid"></div>
    <script>
$("#grid").kendoGrid({
  columns: [
    { field: "name" },
    { field: "age" }
  ],
  dataSource: [
    { name: "Jane Doe", age: 30 },
    { name: "John Doe", age: 33 }
    ],
    databound: function (e) {
        console.log("dataBound");  //Not firing
    },
    dataBinding: function (e) {
    
        console.log("dataBinding"); //Firing
       
  }
});
    </script>
</body>
</html>

Upvotes: 1

Views: 1610

Answers (1)

G_P
G_P

Reputation: 2168

It's a minor mistake - check the case on your event names, databound should be dataBound:

    <script>
$("#grid").kendoGrid({
  columns: [
    { field: "name" },
    { field: "age" }
  ],
  dataSource: [
    { name: "Jane Doe", age: 30 },
    { name: "John Doe", age: 33 }
    ],
    dataBound: function (e) {
        console.log("dataBound");  //Not firing
    },
    dataBinding: function (e) {
    
        console.log("dataBinding"); //Firing
       
  }
});
    </script>

Upvotes: 1

Related Questions