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

[sandeep kumar]

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