onDataBound

5 posts, 0 answers
  1. Juan Sola
    Juan Sola avatar
    26 posts
    Member since:
    Jan 2007

    Posted 27 Aug 2012 Link to this post

    How can I tell in event onDataBound if the chart has bound to any data? I would like to display a "No data available" message.
  2.
  3. Iliana Nikolova
    Admin
    Iliana Nikolova avatar
    2622 posts

    Posted 28 Aug 2012 Link to this post

    Hi Juan,

    The described functionality is not supported out of the box, however you could achieve it using custom implementation. For example you could create a function which place a <div> or <p> with the following styling over the Kendo UI Chart if there are no records:    
    function onDataBinding(e) {
        $('<div class="custom-overlay"><p id="message">SomeMessageHere</p></div>').appendTo("#ComfortChart");
    }
     
    //....
     
    .custom-overlay {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        opacity: .2;
        filter: alpha(opacity=60);
       background-color: #6495ed;
        font-size: 34px;
    }
    #message{
        position: absolute; left: 30%; top: 50%;
        
    }
    ​


    For convenience I prepared a small jsFiddle example which illustrates the aforementioned approach in action.

    Regards,

    Iliana Nikolova
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  5. Juan Sola
    Juan Sola avatar
    26 posts
    Member since:
    Jan 2007

    Posted 28 Aug 2012 Link to this post

    Great! That will work just fine.

    Thanks!
  7. Sam
    Sam avatar
    6 posts
    Member since:
    Jan 2015

    Posted 25 Jul 2015 in reply to Iliana Nikolova Link to this post

    Illiana-

    Your example doesn't make any sense (jsfiddle).  All you are doing is calling a function on document load to overlay the chart.  Can you please work up an example that works with the chart's events. For example this does NOT work:

     http://jsfiddle.net/petf7tbb/

     dataBound: function(e) {

                var showMessage = this.dataSource.data().length == 0;
                if (showMessage) onDataBinding();
            }​

  8.
  9. Iliana Nikolova
    Admin
    Iliana Nikolova avatar
    2622 posts

    Posted 30 Jul 2015 Link to this post

    Hi Sam,

    This example uses a very old version of Kendo UI - please check this one which uses the latest official release and everything works as expected.

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