Automatic load and Save Persist State and Grid event

[Bruno]

Hello,

I'm using the "persist State" method (ASP MVC mode)

Everything works fine but when I use the Grid Event in order to save and load automatically (.Filter("onFiltering"),.DataBinding("onDataBinding")...), I've a javascript error (grid is undefined. Jquery not supported in javascript function I suppose...)

function onFiltering(e) {
                //alert("onFiltering activé"); works
                var grid = $("#Grid").data("kendoGrid");
                e.preventDefault();
                localStorage["kendo-grid-options"] = kendo.stringify(grid.getOptions());
                return (localStorage["kendo-grid-options"]);
            };

            function onDataBinding(e) {
                //alert("onDataBinding activé");
                var grid = $("#Grid").data("kendoGrid");
                e.preventDefault();
                var options = localStorage["kendo-grid-options"];
                if (options) {
                    grid.setOptions(JSON.parse(options));
                }
            };

So any idea to include jquery function /or convert jquery to js?

thanks!!

[Dimiter Topalov]

Hi Bruno,

The described code should work, if the Kendo UI Grid has its name defined as 'Grid' (case sensitive) (...Kendo().Grid().Name("Grid")...).

In the event handlers, the widget instance is also available via e.sender, i.e.:

function onFiltering(e) {
var grid = e.sender;
...

In general, using jQuery in Kendo UI widgets' event handlers is supported and works as expected, e.g.:

http://demos.telerik.com/kendo-ui/grid/events

I hope this helps, but if I am missing something, please send us a similar isolated runnable project, where the issue can be observed, so we can inspect it and determine what might be causing it. Thank you in advance.

Regards,
Dimiter Topalov
Telerik by Progress

[Bruno]

Thanks Dimiter for your help

Sadly it doesn't works no more. The javascript Chrome debugger says:

Uncaught ReferenceError: getOptions is not defined

So please see my Index and Controler joined. Hope this helps.

I fear the get/setOptions functions are not authorized in an event but is there a workaround?

Regards

 

 

[Dimiter Topalov]

Hello Bruno,

The described error occurs because there is no getOptions() function declared:

if (getOptions() != undefined){

grid.getOptions() should be used instead to get the Grid's current options.

Calling the setOptions() method in an event handler is not advisable, as described in the respective section of our API reference:

http://docs.telerik.com/kendo-ui/api/javascript/ui/grid#methods-setOptions

You can use the dataBound event to store the Grid's initial state on page load, and some other custom event (e.g. button click) to load previously stored settings, as shown in the following online demo:

http://demos.telerik.com/kendo-ui/grid/persist-state

Regards,
Dimiter Topalov
Telerik by Progress

[Bruno]

Thanks Dimiter,

Oups I should have read the documentation.... ^^!

There are three important things to keep in mind when using getOptions and setOptions.
calling setOptions() in a Grid event handler is not possible.
calling setOptions() in a function, which is related to the Grid's databinding mechanism may cause an endless loop.

[...]