Loading Fusion Charts Upon Clicking Button In Asp.net

[Uchi]

I am trying to show my fusion chart in a specific area specially where i am calling the CreateChart function in my aspx file so i only want the chart to load upon clicking a button. The way I have it right now is that the chart loads as soon as the page loads but what I would like to see is the chart only loads when the button is clicked. I have tried different ways but not able to get it right since I am not so familiar with fusion charts.

Thanks Here is my ASPX file:

 

<table class="style1">

<td class="style8">
               <asp:Button ID="btnClick" runat="server" Height="29px" Text="Button" 
                   Width="158px" onclick="btnClick_Click" />
           </td>

<td class="style4" colspan="2">
              <% =CreateChart() %> </td>
       </tr>
   </table>

and here is my code behind:

public string CreateChart()
   {
       SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["MyConnectionString"].ConnectionString);
       string sqlStatement = "select   Status1, Count(Status1) as TotalCount from  MyTable where Closing_Date =  '" + txtStartClosingDate.Text + "' and Closing_Date <= '" + txtEndClosingDate.Text + "' and Status1 is not null group by  Status1";
       SqlCommand cmd = new SqlCommand(sqlStatement, con);
       con.Open();
       SqlDataReader reader = cmd.ExecuteReader();
       string strXML;
       strXML = "<graph labelDisplay='auto' useEllipsesWhenOverflow='1' decimals='2' decimalPrecision='0' showValues='1' enablesmartlabels='0' showlabels='0'  legendAllowDrag='1' numberSuffix=' Days' showLegend='1' pieSliceDepth='45' formatNumberScale='0'>";
       while (reader.Read())
       {
           strXML += "<set name='" + reader["Category"].ToString() + "' value='" + reader["AvgNumbers"].ToString() + "' />";
       }
       strXML += "</graph>";
       return FusionCharts.RenderChart("../FusionCharts/Pie2D.swf", "ChartID", strXML, "FactorySum", "450", "450", false, false);

   }

 

Edited January 22, 2013 by Uchi

[Sanjukta]

Hi,

 

I am trying to show my fusion chart in a specific area specially where i am calling the CreateChart function in my aspx file so i only want the chart to load upon clicking a button. The way I have it right now is that the chart loads as soon as the page loads but what I would like to see is the chart only loads when the button is clicked. I have tried different ways but not able to get it right since I am not so familiar with fusion charts.

Thanks Here is my ASPX file:

 

<table class="style1">

<td class="style8">
               <asp:Button ID="btnClick" runat="server" Height="29px" Text="Button" 
                   Width="158px" onclick="btnClick_Click" />
           </td>

<td class="style4" colspan="2">
          	<% =CreateChart() %> </td>
       </tr>
   </table>

and here is my code behind:

public string CreateChart()
   {
       SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["MyConnectionString"].ConnectionString);
       string sqlStatement = "select   Status1, Count(Status1) as TotalCount from  MyTable where Closing_Date =  '" + txtStartClosingDate.Text + "' and Closing_Date <= '" + txtEndClosingDate.Text + "' and Status1 is not null group by  Status1";
       SqlCommand cmd = new SqlCommand(sqlStatement, con);
       con.Open();
       SqlDataReader reader = cmd.ExecuteReader();
       string strXML;
       strXML = "<graph labelDisplay='auto' useEllipsesWhenOverflow='1' decimals='2' decimalPrecision='0' showValues='1' enablesmartlabels='0' showlabels='0'  legendAllowDrag='1' numberSuffix=' Days' showLegend='1' pieSliceDepth='45' formatNumberScale='0'>";
       while (reader.Read())
       {
           strXML += "<set name='" + reader["Category"].ToString() + "' value='" + reader["AvgNumbers"].ToString() + "' />";
       }
       strXML += "</graph>";
       return FusionCharts.RenderChart("../FusionCharts/Pie2D.swf", "ChartID", strXML, "FactorySum", "450", "450", false, false);

   }

 

 

Please note that if you are using ASP.Net to create a button on the client-side and renders the chart on clicking, there is a fair chance that the entire page would get refreshed or partially refreshed using AJAX + Update Panel, as it would go back to server and return to client side. You would need to call the "renderChart()" function on button click.

 

In case your requirement is to render chart on button click, we would recommend you to use JavaScript to achieve this.

 

Hope this helps.