Kendo Grid not refreshing - Forum - Mobile - Progress Community

Kendo Grid not refreshing

 Forum

Kendo Grid not refreshing

This question is answered

Hi There, 

I have a kendo grid that I populate using a search box which sends my filter to the appserver and returns a dataset.

I am able to populate my grid with rows the first time but when I try search again the grid is not being populated. I can see that the dataset has been returned from the appserver but the grid is not changing.

This is the code I am using to populate the grid:

function createGrid(modelFilter) {

$('#grid').kendoGrid({
dataSource: {
serverFiltering: true,
filter: {
value: modelFilter
},
type: "jsdo",
transport: {
jsdo: "beAdvSrc1",
},
error: function(e) {
var obj = JSON.parse(e.xhr.response);
alert(obj._retVal);
}
},
height: 800,
groupable: true,
sortable: true,
reorderable: true,
resizable: true,
selectable: true,
pageable: {
refresh: true,
pageSizes: true,
pageSize: 20,
buttonCount: 10
},
columns: [{
field: 'model',
title: 'Model',
width: 100
}]
});

}

Does anyone know what I could be missing that is causing the grid not to refresh?

Thanks in advance.

Verified Answer
  • Are you re-creating the grid in the createGrid() method? You should not need to.

    You would use the same grid that you have and from within the readCatalogue(), you would call the filter() method on the DataSource.

    If you re-create the grid, then it would use the filter that is defined when it is configured.

All Replies
  • Hello Meyrick,

    How are you implementing the search box? What methods are you calling?

    You should be able to something like the following:

               var grid = $("#grid").data("kendoGrid");

               grid.dataSource.filter(filter);

    The filter() would then use the JSDO internally to access the AppServer.

    I hope this helps.

  • Hi Edsel,

    This is the HTML for my search control:

       <ul class="form-content" data-role="listview" data-style="inset">

           <li>

               <label>Search

                   <input onkeydown="if (event.keyCode == 13) { readCatalogue(this.value);}" placeholder="Search" type="search">

               </label>

           </li>

       </ul>

    On enter of the search control it calls the function below, which then populates the grid.

    function readCatalogue(model)

    {

          var modelFilter = model;

          createGrid(modelFilter);

    }        

    I have added the code you supplied and again I can see the dataset returned to the client but the grid is still not refreshing and displaying the new data.

  • Are you re-creating the grid in the createGrid() method? You should not need to.

    You would use the same grid that you have and from within the readCatalogue(), you would call the filter() method on the DataSource.

    If you re-create the grid, then it would use the filter that is defined when it is configured.

  • Thank you Edsel!