grid.setOptions causes empty grid

[Jan Meinken]

Hi all, 

in our Application we are using a normal grid. We are trying to save the Filters with the following code: 

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

localStorage["kendo-grid-options"] = kendo.stringify(grid.getOptions());

This works perfectly. We are trying to reload our saved Filters with the following code: 

var options = localStorage["kendo-grid-options"];
            if (options) {
                grid.setOptions(JSON.parse(options));
            }

After this our Grid is just empty... The filters are applied to the coloumns.. 
If we click on the refresh icon on our grid or trigger the click in code ($('.k-i-refresh').trigger('click');) the filtered data appears?

Any ideas?

Our main target is to apply the filters on the first load.. So if we leave the page, and go back to the grid should directly display the filtered data.. But so far all our attempts failed.. 

Regards

[Kiril Nikolov]

Hello Jan,

 

I am afraid that the issue is not a known one, nor is reproducible in our online demos, so please extract a runnable sample in a Kendo UI Dojo and we will be happy to help.

 

Regards,
Kiril Nikolov
Telerik

 

 

[Will]

This is kind of late but I was searching for problems similar to mine and this sounds like one.

What I have found so far is that by calling the Grid's setOptions() method, some internal methods were being called more than once that shouldn't have been.  I'm guessing that setOptions() is not checking for duplicate or conflicting option settings and blindly binding to duplicate callbacks for the same event(s).

In my case, the setOptions() call was in some obsolete code anyway so I just removed it.

 In the future, I'd try using getOptions() first and un-set anything I was aiming to set first.

Will

[Kiril Nikolov]

Hello Will,

setOptions() will extend the current options of the Grid. So it does check for duplicated options and overwrites them with the new ones.

Regards,
Kiril Nikolov
Telerik

 

 

[Paul]

Hello,

 

I am having this exact same issue since upgrading to 2015 Q3 SP1.  I've created a dojo example using as close our MVC generated grid, and I simplified it as much as possible while still reproducing the problem.  Needed to add kendo.aspnetmvc.min.js to includes.

 If you look at the bottom of the script , the problem is reproduced:

 var grid = $('#AgentViewGrid').data('kendoGrid');

var currOpt = grid.getOptions();
//grid.options = currOpt;
grid.setOptions(currOpt);

The commented line is a workaround I found - if we explicitly set the options object first by assigning it, THEN call setOptions(), the problem dissapears.

 I don't want to go with this workaround in production, however, since I don't understand what it is doing.  Please let me know if you can determine what about our grid is keeping setOptions() from working.

 Best regards,

Paul Haines

[Paul]

http://dojo.telerik.com/@[e-mail]/AXiTO

[Kiril Nikolov]

Hello Paul,

 

The example that you sent is what is generated from the MVC wrappers, and therefore it is not really one that can be used for investigation. This is why I have created an example, where the issue was not reproduced, please check it out and edit it in order to show the issue and we will be happy to help:

 

http://dojo.telerik.com/iBIHu

 

Regards,
Kiril Nikolov
Telerik

 

 

[Dan]

Hi,

Here is a reproducible example

http://dojo.telerik.com/eGANAXES

First press the Save button then the Load button and you will see that the data is removed.

 

[Alex Hajigeorgieva]

Hi, Dan,

Thank you for the provided example.

The Kendo UI Grid is set not to autoBind to its data source.

When the new settings are passed, the existing ones are deep extended. This means that the grid after the call to the setOptions() method will also have "autoBind:false" in its settings.

So in the provided dojo, you may do either of the following:

- either pass "autoBind:true" in the new options

http://dojo.telerik.com/eGANAXES/2

grid.setOptions({columns: [{
      field: "Country",
  }, {
      field: "ContactName",
      title: "Contact Name",
  }, {
      field: "CompanyName",
      title: "Company Name",
  }, {
      field: "ContactTitle",
      title: "Contact Title",
  }], autoBind:true});

- call the grid refresh() method

https://docs.telerik.com/kendo-ui/api/javascript/ui/grid/methods/refresh

- make a read request 

Kind Regards,
Alex Hajigeorgieva
Progress Telerik