Asp. NET Web site Real Time Display method _ Practical skills

Source: Internet
Author: User

This article describes the ASP.net Web site real-time display of time method. Share to everyone for your reference. The specific methods are as follows:

When designing a Web site or Web application in a asp.net environment, it is often necessary to display the current date and time in real time. This is usually accomplished using an AJAX control.

It should be noted that in the. NET Framework version 2.0, there is no AJAX extensions control in the Toolbox. Ajax is integrated into the. NET Framework version 3.5.

ASP.net Ajax consists of three parts:

① a client library or framework that extends client JavaScript functionality;
② a server-side programming and development expansion pack that allows ASP.net ajax to be well integrated into Visual Studio;
③ a toolkit developed and supported by the community.

On the server side, the Ajax expansion pack contains a handful of Ajax controls, namely ScriptManager, ScriptManagerProxy, Timer, UpdatePanel, updateprogess.

Where the ScriptManager control can instruct the ASP.net configuration engine to send a response to the client using AJAX and to introduce a script library when sending a response.

Pay special attention to: each AJAX-enabled ASP.net Web form must contain and contain only one ScriptManager control.
UpdatePanel is a container of controls in a new Web form that is implemented using AJAX. Each asp.net Web form that you want to support Ajax can contain one or more UpdatePanel controls.

To achieve real-time display time, only the following two steps are required:

1. Create a new Web form in the ASP.net project, named Showcurrenttime, whose foreground code is as follows.

Copy Code code as follows:
<%@ Page language= "C #" autoeventwireup= "true" codefile= "ShowCurrentTime.aspx.cs" inherits= "Showcurrenttime"%>

<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">

<title> dynamic display of real-time time </title>

<body>
<form id= "Form1" runat= "Server" >
<!--must use the. NET Framework version 3.5, the Toolbox will have built-in Ajax Extensions-->
<div>
<asp:scriptmanager id= "ScriptManager1" runat= "Server" ></asp:ScriptManager><!--must contain this control. Otherwise UpdatePanel cannot use-->
</div>
<table style= "Position:absolute; margin-left:200px; margin-right:200px; margin-top:100px; width:270px; height:78px; top:15px; left:10px; " >
<tr>
<td> dynamic display of real-time time </td>
</tr>
<tr>
&LT;TD style= "height:100px;" >
<asp:updatepanel id= "UpdatePanel1" runat= "Server" >
<ContentTemplate> Current time is:
<!--lable and timer controls must all be included in the UpdatePanel control-->
<asp:label id= "Label1" runat= "Server" text= "Label" ></asp:Label> <!--used to display time-->
<asp:timer id= "Timer1" runat= "Server" interval= "1000" ></asp:Timer><!--for update time, update once every 1 seconds-->
</ContentTemplate>
</asp:UpdatePanel>
</td>
</tr>

</table>
</form>
</body>

2, in the ShowCurrentTime.aspx.cs file, only need to add a code can be. The code is as follows:

Copy Code code as follows:
Using System;
Using System.Collections.Generic;
Using System.Linq;
Using System.Web;
Using System.Web.UI;
Using System.Web.UI.WebControls;

public partial class ShowCurrentTime:System.Web.UI.Page
{
protected void Page_Load (object sender, EventArgs e)
{
Label1.Text = DateTime.Now.ToString ();

}
}

At this point, the function of real-time display time in label is completed. Alternatively, you can set the style for the time display as needed.

If you want to display only dates without displaying the time, you can use substring to take out the previous date.

I hope this article will help you with the ASP.net program design.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.