模板列中的RadGrid倒计时时钟

时间:2014-04-22 10:20:02

标签: c# asp.net telerik telerik-grid radgrid

我将Telerik Radgrid绑定到SQLDatasource(项目是数据绑定),在其中一个数据绑定列中,类型DateTime格式的值为H:mm:ss {0:H:mm:ss}。然后我添加了一个显示“剩余时间”的模板列

所以:开始时间 - 现在= Time Left

我想要这个Ajaxified所以我在模板列的updatepanel中添加了一个计时器和一个标签 - 对于每个tick(1000ms)我重新计算time left

这似乎有效但仅适用于RadGrid中的第一行

以下是代码段

ASP

    <telerik:GridTemplateColumn FilterControlAltText="Filter TemplateColumn column"     UniqueName="TemplateColumn"
HeaderText="Starting in">
  <ItemTemplate>
     <contenttemplate>               
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
        <ContentTemplate>
          <asp:Label ID="lbltime" runat="server" Text="00:00:00"></asp:Label>
          <asp:Timer ID="Timer1" runat="server" Interval="1000" ontick="Timer1_Tick"></asp:Timer>
         </ContentTemplate>
         </asp:UpdatePanel>
      </contenttemplate>
  </ItemTemplate>
</telerik:GridTemplateColumn>

C#

        protected void Timer1_Tick(object sender, EventArgs e)
    {
        GridDataItem viewitem = (sender as System.Web.UI.Timer).Parent.Parent.Parent.Parent as GridDataItem;

        DateTime starttime = DateTime.ParseExact((viewitem.FindControl("Strat_TimeLabel") as Label).Text, "H:mm:ss", System.Globalization.CultureInfo.CurrentCulture);
        DateTime nowtime = System.DateTime.Now;
        TimeSpan ts = new TimeSpan();
        ts = starttime - nowtime;

        GridDataItem item = (sender as System.Web.UI.Timer).Parent.Parent.Parent.Parent as GridDataItem;
        if (ts.Seconds >= 0 && ts.Minutes > 0)
        {
            DateTime d = new DateTime(2000, 01, 01, ts.Hours, ts.Minutes, ts.Seconds);
            (item.FindControl("lbltime") as Label).Text = d.ToString("H:mm:ss");
        }
        else
        {
            (item.FindControl("lbltime") as Label).Text = "00:00:00";
        }
    }  

任何帮助或建议都将不胜感激

1 个答案:

答案 0 :(得分:0)

如果有人有兴趣,我找到了解决方法。

我移动了updatepanel来封装整个RadGrid(Timer也仍然包含在updatepanel中)

我将Timer1_Tick背后的 C#代码更改为

        foreach (GridDataItem item in RadGrid1.Items)
        {
            DateTime starttime = DateTime.ParseExact((item.FindControl("Strat_TimeLabel") as Label).Text, "H:mm:ss", System.Globalization.CultureInfo.CurrentCulture);
            DateTime nowtime = System.DateTime.Now;
            TimeSpan ts = new TimeSpan();
            ts = starttime - nowtime;

            System.Web.UI.Timer).Parent.Parent.Parent.Parent as GridDataItem;
            if (ts.Seconds >= 0 && ts.Minutes > 0)
            {
                DateTime d = new DateTime(2000, 01, 01, ts.Hours, ts.Minutes, ts.Seconds);
                (item.FindControl("lbltime") as Label).Text = d.ToString("H:mm:ss");
            }
            else
            {
                (item.FindControl("lbltime") as Label).Text = "Complete";
            }   
        }

然后对于每个GridCommand我只是禁用/启用计时器

    InsertCommand: Timer1.enabled = false;
    EditCommand: Timer1.enabled = false;
    UpdateCommand: Timer1.enabled = True;
    CancelCommand: Timer1.enabled = false;

可能不是最有说服力的方式,因为我希望在项目模板中包含回发事件......但是它有效......总是欢迎改进和建议。