refresh

Renders all table rows using the current data items.

Example - refresh the widget

<div id="grid"></div>
<script>
$("#grid").kendoGrid({
  columns: [
    { field: "name" },
    { field: "age" }
  ],
  dataSource: [
      { name: "Jane Doe", age: 30 },
      { name: "John Doe", age: 33 }
  ]
});
var grid = $("#grid").data("kendoGrid");
grid.refresh();
</script>

Example - change the value of a dataItem and refresh the widget

<button id="refresh" class="k-button">Refresh</button>
<div id="grid"></div>
<script>
$("#grid").kendoGrid({
  toolbar: ["save"],
  columns: [
    { field: "name" },
    { field: "age" },
  ],
  dataSource: {
    data: [
      { id: 1, name: "Jane Doe", age: 30 },
      { id: 2, name: "John Doe", age: 33 }
    ],
    schema:{
        model: {
         id: "id",
         fields: {
           age: { type: "number"}
         }
     }
   }
  },
  editable: true
});

$("#refresh").click(function(){
var grid = $("#grid").data("kendoGrid");
// Change the name of the first dataItem.
grid.dataSource.data()[0].name = "Different John";
// Call refresh in order to see the change.
grid.refresh();
});
</script>