kendo.ui.progress removes child progress indicator

2 posts, 1 answers
  1. László
    László avatar
    12 posts
    Member since:
    Jul 2008

    Posted 02 Oct 2014 Link to this post

    Hi,

    I noticed that kendo.ui.progress method removes the loading indicator from all of it's descendant. I have 2 async processes which started (almost) at the same time. One indicator showed on a div, and an other indicator showed in a child div. The longer process indicator belongs to the child div's indicator. When the shorter process finished (which has the indicator on the parent div) both the indicators removed.

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8">
        <title>Kendo UI Snippet</title>
     
     
        <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    </head>
    <body>
      <div id="parentDiv" style="position:relative;width:400px;height:400px; background-color:red">
        <div id="childDiv" style="position:relative;width:150px;height:150px; background-color:blue">
        </div>
      </div>
    <script>
      kendo.ui.progress($('#parentDiv'), true);
      kendo.ui.progress($('#childDiv'), true);
     
      setTimeout(function() { kendo.ui.progress($('#parentDiv'), false);  }, 1500);
      setTimeout(function() { kendo.ui.progress($('#childDiv'), false);  }, 10000);
    </script>
    </body>
    </html>

    Is it by design behavior or is it a bug?

    Regards
    Laszlo Jakab
  2. Answer
    Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2596 posts

    Posted 02 Oct 2014 Link to this post

    Hello Laszlo,

    The kendo.ui.progress is meant to be used for Kendo UI Widgets (especially the Kendo UI Grid) and nesting progress elements in parent/child containers is not supported by default. Therefore the behavior in your example is expected and there is no workaround.

    Regards,
    Kiril Nikolov
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
Back to Top