Bar chart is not getting refeshed on page submit.

2 posts, 0 answers
  1. Pritam
    Pritam avatar
    16 posts
    Member since:
    Jan 2013

    Posted 10 May 2013 Link to this post

    Hello,
    Im desiging a asp.net website using kendo Chart to display year and net benefit from a json file.
    On button click i change the file contents but the graph doesn't show these changes.

     <div id="Div5" class="k-content absConf">
                <div class="chart-wrapper">
                    <div id="chart"></div>
                </div>
                <script>

                    function createChart() {
                        $("#chart").kendoChart({
                            dataSource: {
                                transport: {
                                    read: {
                                        url: "js/123.json",
                                        dataType: "json"
                                       
                                    }
                                },
                                sort: {
                                    field: "year",
                                    dir: "asc"
                                   
                                }
                            },
                            title: {
                                text: "Net Benefit Chart"
                            },
                            legend: {
                                position: "top"
                            },
                            seriesDefaults: {
                                type: "column"
                            },


                            series:
                            [{
                                field: "val",
                                name: "Net Cash Benefit"

                            }],



                            categoryAxis: {
                                field: "year",
                                labels: {
                                    rotation: -90
                                },
                                
                                majorGridLines: {
                                    visible: true
                                },
                            },
                            valueAxis: {
                                labels: {
                                    format: "Net Cash Benefit"
                                },
                                majorUnit: 5,
                                line: {
                                    visible: true
                                
                                }
                               
                         
                            },
                            tooltip: {
                                visible: true,
                                format: "N0"
                            }
                        });

                        
                    }
                   
                    $(document).ready(function () {
                        setTimeout(function () {
                            // Initialize the chart with a delay to make sure
                            // the initial animation is visible
                            createChart();
             }, 5);
                    });
                   

                </script>
            </div>


    Ive attached the json too as an image.

    Please help me.
  2. Iliana Nikolova
    Admin
    Iliana Nikolova avatar
    2622 posts

    Posted 10 May 2013 Link to this post

    Hi Pritam,

    In order to achieve the desired result you should re-read the Chart's dataSource. For example: 
    $("#chart").data("kendoChart").dataSource.read();

    More detailed information about the read() method is available in the corresponding documentation.

    Kind 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!
Back to Top