Automatic load and Save Persist State and Grid event

5 posts, 1 answers
  1. Bruno
    Bruno avatar
    5 posts
    Member since:
    Jan 2013

    Posted 22 Sep Link to this post

    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!!

  2. Dimiter Topalov
    Admin
    Dimiter Topalov avatar
    347 posts

    Posted 26 Sep Link to this post

    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
    Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.
  3. Kendo UI is VS 2017 Ready
  4. Bruno
    Bruno avatar
    5 posts
    Member since:
    Jan 2013

    Posted 27 Sep in reply to Dimiter Topalov Link to this post

    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

     

     

  5. Answer
    Dimiter Topalov
    Admin
    Dimiter Topalov avatar
    347 posts

    Posted 29 Sep Link to this post

    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
    Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.
  6. Bruno
    Bruno avatar
    5 posts
    Member since:
    Jan 2013

    Posted 29 Sep in reply to Dimiter Topalov Link to this post

    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.

    [...]

Back to Top
Kendo UI is VS 2017 Ready