On DropDown list page PostBack, getting error - "0x800a139e - JavaScript runtime error: Container is not defined"

47 views
Skip to first unread message

sandeep kumar

unread,
Aug 26, 2016, 5:09:37 AM8/26/16
to Google Visualization API
I am creating dynamic chart using Google Visualization API from SQL server Data Base and its working fine, but in my page we have multiple drop down list which have AutoPostBack="true".

On page load i am filling my first drop down and on selecting some value second drop down get filled successfully and then we click on show graph button and graph generated properly, no issue but after this we click on first drop down to select some other value (drop down post back event) i am getting java scrip error - "0x800a139e - JavaScript runtime error: Container is not defined".

Here is the code - 

DataSet ds = _dataAccess.ExecuteQuerySPForDataSet("USP_GetGraphDeatils", dbPrams);
                Session["AppPoolGraphDeatils"] = ds;

                StringBuilder str = new StringBuilder();
                int count = ds.Tables[0].Rows.Count - 1;
                if (count > 0)
                {
                    for (int iColumn = 0; iColumn < ds.Tables[0].Columns.Count - 1; iColumn++)
                    {

                        System.Web.UI.HtmlControls.HtmlGenericControl createDiv = new System.Web.UI.HtmlControls.HtmlGenericControl("DIV");
                        createDiv.ID = "createDiv" + iColumn.ToString();                       
                        createDiv.Style.Add(HtmlTextWriterStyle.Height, "400px");
                        createDiv.Style.Add(HtmlTextWriterStyle.Width, "1000px");
                        this.Controls.Add(createDiv);                       


                        str.Append(@" <script type='text/javascript'>
                                                      google.load('visualization', '1', {packages: ['corechart']});
                                                    </script>
                                                    <script type='text/javascript'>
                                                    function drawVisualization() { ");
                        str.Append(@"var data" + iColumn.ToString() + " = google.visualization.arrayToDataTable([['" + ds.Tables[0].Columns[0].ColumnName + "', '" + ds.Tables[0].Columns[iColumn + 1].ColumnName + "'],");

                        for (int i = 0; i <= count; i++)
                        {
                            if (count == i)
                            {
                                str.Append("['" + ds.Tables[0].Rows[i][0].ToString() + "'," + ds.Tables[0].Rows[i][iColumn + 1].ToString() + "]]);");
                            }
                            else
                            {
                                str.Append("['" + ds.Tables[0].Rows[i][0].ToString() + "'," + ds.Tables[0].Rows[i][iColumn + 1].ToString() + "],");
                            }
                        }
                        if (ds.Tables[0].Columns[iColumn + 1].ColumnName == "HttpConnections")
                        {
                            str.Append("var options" + iColumn.ToString() + " = { title : '" + ds.Tables[0].Columns[iColumn + 1].ColumnName + "' , vAxis: {title: '" + ds.Tables[0].Columns[iColumn + 1].ColumnName + "'},  hAxis: {format: 'M/d/yy',title: '" + ds.Tables[0].Columns[0].ColumnName + "' ,textStyle : {fontSize: 10}, slantedText:true, slantedTextAngle: -30}, seriesType: 'line',legend: 'none' };");
                        }
                        else
                        {
                            str.Append("var options" + iColumn.ToString() + " = { title : '" + ds.Tables[0].Columns[iColumn + 1].ColumnName + " in GB" + "' , vAxis: {title: '" + ds.Tables[0].Columns[iColumn + 1].ColumnName + "'},  hAxis: {format: 'M/d/yy',title: '" + ds.Tables[0].Columns[0].ColumnName + "' ,textStyle : {fontSize: 10}, slantedText:true, slantedTextAngle: -30}, seriesType: 'line',legend: 'none' };");
                        }

                        str.Append(" var chart = new google.visualization.ComboChart(document.getElementById('" + createDiv.ID + "'));  chart.draw(data" + iColumn.ToString() + ", options" + iColumn.ToString() + "); } google.setOnLoadCallback(drawVisualization);");
                        str.Append(" </script>");
                    }
                }
                lt.Text = str.ToString();


My ASPX page code - 

 <div>
            <asp:Literal ID="lt" runat="server"></asp:Literal>
           
        </div>

Please let me know what i am missing here to correct above error.

Thanks
Sandeep
Reply all
Reply to author
Forward
0 new messages