Update a Refresh Panel from Another Refresh Panel

WebAsyncRefreshPanel has a useful feature that allows a refresh panel's hidden asynchronous postback to update the content of another refresh panel. An example scenario in which this feature would be useful is if you wanted to allow your end users to view data in two different chart types (i.e., Column and Radar charts). This topic will guide you through setting up WARP Panel for this example scenario.

1. Create a new Microsoft® Visual Studio® ASP.NET WebSite.
2. Before you start writing any code, you should place using/imports directives in your code-behind so you don't need to always type out a member's fully qualified name.

3. In Visual Basic:

   Imports Infragistics.UltraChart.Shared.Styles
   

   In C#:

   using Infragistics.UltraChart.Shared.Styles;
   

   
   
4. From the toolbox, drag WARP Panel onto the Web form. Place a Label and DropDownList control into the WARP Panel control.
5. Set the Label's Text property to "Chart Type:".
6. Specify that the DropDownList control has two items, one called: "ColumnChart" and "RadarChart". Set the ColumnChart to be the default selection in the Items collection editor. In addition, on the DropDownList control, make sure you set the AutoPostBack property to True, so that changing the selected item will cause a postback.
7. From the toolbox, drag another WARP Panel control onto your Web form. Place the WebChart control in the second WARP Panel control. Leave the chart with its default settings.
8. Select the first WARP Panel control. In the Properties window, select the  LinkedRefreshControlID property, and in the drop-down list for the property, select the name of the second WARP Panel control that contains the chart.
9. In the code-behind, create the Page Load event and specify the data source for the chart. Then call the chart's data bind.
10. Note: This topic does not show you the actual data to which the chart is being bound. For information on this subject, see WebChart's Data section.
    
    

    In Visual Basic:

    Private Sub Page_Load(ByVal sender As System.Object, _
      ByVal e As System.EventArgs) Handles MyBase.Load
    	Me.UltraChart1.DataSource = GetColumnData()
    	Me.UltraChart1.DataBind()
    End Sub
    

    In C#:

    private void Page_Load(object sender, System.EventArgs e)
    {
    	this.UltraChart1.DataSource = GetColumnData();
    	this.UltraChart1.DataBind();
    }
    

    
    
11. In the code-behind, specify the DropDownList's SelectedIndexChanged event, using the following code sample. This code sample checks to see if the  ChartType property is set to ColumnChart; if it is, it changes the property to RadarChart, if the property is set to RadarChart, it changes the property to ColumnChart.

12. In Visual Basic:

    Private Sub DropDownList1_SelectedIndexChanged(ByVal sender As Object, _
      ByVal e As System.EventArgs) Handles DropDownList1.SelectedIndexChanged
    	If Me.UltraChart1.ChartType.ToString() = "ColumnChart" Then
    		Me.UltraChart1.ChartType = ChartType.RadarChart
    		Me.UltraChart1.DataSource = GetRadarData()
    		Me.UltraChart1.DataBind()
    	Else
    		Me.UltraChart1.ChartType = ChartType.ColumnChart
    		Me.UltraChart1.DataSource = GetColumnData()
    		Me.UltraChart1.DataBind()
    	End If
    End Sub
    

    In C#:

    private void DropDownList1_SelectedIndexChanged(object sender, System.EventArgs e)
    {
    	if(this.UltraChart1.ChartType.ToString() == "ColumnChart")
    	{
    		this.UltraChart1.ChartType = ChartType.RadarChart;
    		this.UltraChart1.DataSource = GetRadarData();
    		this.UltraChart1.DataBind();
    	}
    	else
    	{
    		this.UltraChart1.ChartType = ChartType.ColumnChart;
    		this.UltraChart1.DataSource = GetColumnData();
    		this.UltraChart1.DataBind();
    	}
    }
    

    
    
13. Run the Web form. Then change the value of the drop-down list. You will see the chart re-render as the specified chart type without causing the page to post back.