Method of refreshing data on a page, alternating through sources

Question

Currently I have a single web page, asp.net and c#, that fetches data from the SQL server and displays it in a simple chart. The number of rows returned varies.

The goal is to have the web page display a small set of data for x amount of seconds, then refresh the page to show an overview of all the datasets. The data is retrieved through a stored procedure, and the changes should only happen in the web page displaying it.

What I have

To populate the chart at pageload, I use the following:

public void PopulateGraph(int? channelID)
        {
            DataSet dsPzData = new DataSet();
            dsPzData = oDb.pickingdata(channelID);
            chtPzMonitor.DataSource = dsPzData.Tables[0];
            chtPzMonitor.Series[0].YValueMembers = dsPzData.Tables[0].Columns[2].ColumnName;
            chtPzMonitor.Series[0].AxisLabel= dsPzData.Tables[0].Columns[0].ColumnName;
            chtPzMonitor.DataBind();
        }

And it's shown with:

<asp:Chart ID="chtPzMonitor" runat="server" Height="1013px" Width="1276px">
    <series>
        <asp:Series BackSecondaryColor="Red" ChartType="Bar" 
            Font="Microsoft Sans Serif, 35pt, style=Bold" IsValueShownAsLabel="false"  CustomProperties="BarLabelStyle=Right"
            Name="Series1">
        </asp:Series>
    </series>
    <chartareas>
        <asp:ChartArea Name="PZLabels">
            <AxisY LabelAutoFitMaxFontSize="15" LabelAutoFitMinFontSize="8">
            </AxisY>
            <AxisX LabelAutoFitMaxFontSize="40" Interval="1">
            </AxisX>
        </asp:ChartArea>

    </chartareas>
</asp:Chart>

The Problem

The data on the page doesn't change. Aside from the <meta http-equiv="refresh" content="7"/> tag of the original site, the data on the chart doesn't seem to get updated.

One solution I've tried uses a timer, which I temporarily added to be shown on a label, and it doesn't seem to be updating either - or it's updated but the way I try to redraw the chart simply doesn't refresh it.

What I tried

I thought running a timer with a trigger event would be the simplest way to achieve this, so I tried the following:

<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:Timer ID="Timer1" runat="server" OnTick="Timer1_Tick" Interval="5000" />

While wrapping the chart in the asp:UpdatePanel and ContentTemplate tags. The Timer1_tick method I thought would be simple enough:

Int32 timeCount = 0;
protected void Timer1_Tick(object sender, EventArgs e)
{
    channelID = Convert.ToInt32(Request.QueryString["ID"].ToString());
    if (channelID < 1000)
    {
        timeCount += 1;
        if (timeCount > 3)
        {
            timeCount = 0;
            PopulateGraph(1000);
        }
        else
            PopulateGraph(channelID);
    }
}

The ID 1000 being the 'overview' page I want to show, and the counter so that the single channel data is shown for 15 seconds, and then we switch on the overview for five seconds, and back again.

I also tried using a server side script for the tick-method, but this seemed to require an even more extensive rewrite, which I am trying to avoid.

What am I missing here, or have I taken an approach that's just too complicated to begin with? If there's a simpler option for just alternating reloads for the page, that could be made to work as well.

Answer 1

Took me a day, but what I wanted to do is now working.

In the .aspx file, we have <meta http-equiv="refresh" content="15" /> in the header to refresh the page.

In the body, I run a timer.

<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="true" />
<asp:Timer ID="Timer1" runat="server" OnTick="Timer1_Tick" Interval="9000" />

This timer updates the necessary content on the page.

<asp:UpdatePanel ID="chartPanel" runat="server" UpdateMode="Conditional">
<Triggers>
 <asp:AsyncPostBackTrigger ControlID="Timer1" />
</Triggers>
 <ContentTemplate>
  (chart here)
 </ContentTemplate>
</asp:UpdatePanel>

This chart is updated through the timer's tick method in the .aspx.cs:

protected void Timer1_Tick(object sender, EventArgs e)
{
  PopulateGraph(1000);
}

The 1000 is the special case to pull information from all aisles, not just the single one given by the user - The way the operators use this view in the field is to define the aisle with a query string, "?ID=1", for example.

This solution keeps the original aisle information on the screen for 9 seconds, then the timer ticks and populates the graph with the new information, and after 6 seconds the page is refreshed to the original content.