Hôm trước dạo qua diễn đàn vn-zoom có thấy có bạn hỏi về vấn đề này, rằng là làm sao để tạo được thời gian đếm ngược. Và bài viết sau sẽ hướng dẫn các bạn thực hiện được việc này rất đơn giản bằng ajax.
Các bạn vô Visual Studio tạo một webpage, sau đó add một control Timer vào như dưới đây:
(Chú ý, để sử dụng được control này, mình phải add thêm bộ quản lý script của .net nhé)
|
1 2 3 4 |
<div> <asp:ScriptManager ID= "SM1" runat="server"></asp:ScriptManager> <asp:Timer ID="timer1" runat="server" Interval="1000" OnTick="timer1_tick"></asp:Timer> </div> |
Sau đó thêm một Update panel vô
|
1 2 3 4 5 6 7 8 |
<asp:UpdatePanel id="updPnl" runat="server" UpdateMode="Conditional"> <ContentTemplate> <asp:Label ID="lblTimer" runat="server"></asp:Label> </ContentTemplate> <Triggers> <asp:AsyncPostBackTrigger ControlID="timer1" EventName ="tick" /> </Triggers> </asp:UpdatePanel> |
Ở trong code behind bạn viết như sau
Sự kiện Tick của đồng hồ
|
1 2 3 4 5 6 7 |
protected void timer1_tick(object sender, EventArgs e) { if (0 > DateTime.Compare(DateTime.Now, DateTime.Parse(Session["timeout"].ToString()))) { lblTimer.Text = "Number of Minutes Left: " + ((Int32)DateTime.Parse(Session["timeout"].ToString()).Subtract(DateTime.Now).TotalMinutes).ToString(); } } |
Trong hàm Page_load của trang, bạn viết 1 đoạn code thực hiện khởi tạo một biến session
|
1 2 3 4 5 |
protected void Page_Load(object sender, EventArgs e) { if (!SM1.IsInAsyncPostBack) Session["timeout"] = DateTime.Now.AddMinutes(120).ToString(); } |
Vậy là xong rồi đó, build và chạy thử coi sao:)
[…] khi xem lại những bài viết được nhiều người tìm đọc thì thấy có một bài tạo đồng hồ đếm ngược bằng ajax trong asp.net có vẻ được nhiều người quan tâm. Thành ra dành chút thời gian […]