. Net Ajax (4): timer and updateprogress

Source: Internet
Author: User
1 Overview
Timer and updateprogress are two simple server controls included in ASP. NET Ajax Extensions 1.0. The timer control is used to trigger events on a regular basis, while the updateprogress control is used to display a progress bar for users during partial update.

2 Timer control
The timer control executes sending back at a predetermined interval. If the timer control and updatepanel control are used together, you can regularly refresh the local page. You can also use the timer control to send the entire page.

2.1 Use Cases of timer controls
You can use the timer control in the following cases:

    • Update one or more updatepanel controls periodically without refreshing the entire page.
    • Each time the timer control is sent back, it runs on the server.Code.
    • Periodically send the entire page to the server synchronously.


2.2 background
The timer control is a server control that embeds JavaScript components into web pages. The javascript component starts sending back from the browser when the interval defined in the interval attribute is defined. You can set the timer control attributes in the code running on the server. These attributes are transmitted to the Javascript component.
When using the timer control, the page must contain a scriptmanager control.
When the timer control starts a sending back, the timer control triggers the tick event on the server side. You can create a process for the tick event.ProgramTo send the page back to the server.
Set the interval attribute to specify the frequency of sending back. Set the enabled attribute to enable or disable timer. The interval attribute is in milliseconds, and the default value is 60000 milliseconds, that is, 60 seconds.
Note: Setting the interval attribute to a small value will cause frequent sending back, leading to performance problems. Therefore, use the timer control to refresh the content at the necessary frequency.
If different updatepanel must be updated at different intervals, You can include multiple timer controls on the same page. Another option is that a single Timer control instance can be a trigger for multiple updatepanel controls on the same page.

2.3 use the timer control inside the updatepanel Control
When the timer control is included in the updatepanel control, the timer control automatically becomes the trigger of the updatepanel control. You can set the childrenastriggers attribute of the updatepanel control to false to overwrite this behavior.
For the timer control in the updatepanel control, the Javascript time component is created only at the end of each sending. Therefore, the time interval does not start before the page is returned. For example, if the interval attribute is set to 60000 ms, it takes 3 seconds for the delivery to complete, that is, the next delivery takes 63 seconds after the previous delivery.
The following example shows how to include a timer control in the updatepanel control. The specified timereffectick is the event handler for sending back:
1 < ASP: scriptmanager runat = " Server " ID = " Scriptmanager1 "   />
2 < ASP: updatepanel runat = " Server " ID = " Updatepanel1 "
3 Updatemode = " Conditional " >
4 < Contenttemplate >
5 < ASP: timer ID = " Timer1 " Runat = " Server "
6 Interval = " 120000 "
7 Ontick = " Timerw.tick " >
8 </ ASP: Timer >
9 </ Contenttemplate >
10 </ ASP: updatepanel >
11

2.4 use the timer control outside the updatepanel Control
When the timer control is outside the updatepanel control, the timer control must be explicitly defined as the trigger of the updatepanel control to be updated.
If the timer control is outside the updatepanel control, the Javascript time component continues to run as if it has been processed. For example, if the interval attribute is set to 60000 milliseconds (60 seconds), it takes 3 seconds to complete the sending and receiving process, the next sending and receiving process will be resent 60 seconds after the last sending, the updated content in the updatepanel control is only 57 seconds.
The interval attribute must be set to the value that can be completed before the next sending request is started. If a new sending request is started during the earlier sending request, early sending replies will be canceled.
The following example shows how to use the timer control outside the updatepanel control.

1 < ASP: scriptmanager runat = " Server " ID = " Scriptmanager1 "   />
2 < ASP: timer ID = " Timer1 " Runat = " Server " Interval = " 120000 "
3 Ontick = " Timerw.tick " >
4 </ ASP: Timer >
5 < ASP: updatepanel ID = " Updatepanel1 " Runat = " Server " >
6 < Triggers >
7 < ASP: asyncpostbacktrigger controlid = " Timer1 "
8 Eventname = " Tick "   />
9 </ Triggers >
10 < Contenttemplate >
11 < ASP: Label ID = " Label1 " Runat = " Server "   > </ ASP: Label >
12 </ Contenttemplate >
13
14 </ ASP: updatepanel >

3 updateprogress Control
The updateprogress control provides the status information for updating partial pages in the updatepanel control. You can customize the default content and layout of the updateprogress control. To prevent transient screen update on a partial page, you can set the delay before the updateprogress control is displayed.


3.1 scenarios
When a page contains one or more updatepanel controls for partial page output, you can use the updateprogress control to design a more intuitive interface. If local page updates are slow, you can use the updateprogress control to provide a visual feedback on the Update Status. You can place multiple updateprogress controls on one page, each of which is associated with different updatepanel controls. Another option is to use only one updateprogress control and associate it with all updatepanel controls on the page.

3.2 background
The updateprogress control is output as a <div> element. Its display or hiding depends on whether the associated updatepanel control causes asynchronous sending back. The updateprogress control does not display the original page and synchronous sending back.


3.3 associate an updateprogress control with an updatepanel Control
You can set the associatedupdatepanelid attribute of the updateprogress control to associate it with the updatepanel control. When a source is updatepanel control, all associated updateprogress controls are displayed. If you do not associate the updateprogress control with a specific updatepanel control, the updateprogress control displays the progress for all rounds.
If the childrenastriggers attribute of the updatepanel control is set to false and the asynchronous return source is from the inside of the updatepanel control, all associated updateprogress controls are displayed.

3.4 create updateprogress content
The progresstemplate attribute is used to specify the message displayed by the updateprogress control in Declaration. The <progresstemplate> element can contain HTML and tags. The following example shows how to specify a message for the updateprogress control:
1 < ASP: updateprogress ID = " Updateprogress1 " Runat = " Server " >
2 < Progresstemplate >
3 An update Is   In SS
4 </ Progresstemplate >
5 </ ASP: updateprogress >
6

3.5 specify content Layout
When the dynamiclayout attribute is set to true, the updateprogress control does not occupy the page space at the beginning, and the page dynamically displays the updateprogress control as needed. To support dynamic display, the display style attribute of the <div> element output by the control is initially set to none.
When the dynamiclayout attribute is set to false, the updateprogress control occupies space when the page is displayed, even if the control is not displayed. In this case, the displey style attribute of the <div> element of the control is set to block, and the visibility is initially set to hidden.

3.6 place the updateprogress control on the page
You can place the updateprogress control outside or inside the updatepanel control. The updateprogress control is updated to an asynchronous return with its associated updatepanel control, even if the updateprogress control is included in another updatepanel control.
If the updatepanel control is in another update panel, sending back from the Child panel will display the updateprogress control associated with the Child panel. All the updateprogress controls associated with the parent panel are also displayed. If a direct child control is returned from the parent panel, only the updateprogress control associated with the parent panel is displayed. This is the same logic as how a sending request is triggered.

3.7 specify the display time of the updateprogress Control
You can use the pagerinrequest and endrequesst events of the pagerequestmanager class in JavaScript to programmatically control the display time of the updateprogress control. In the beginrequest event handler, the DOM element indicating the updateprogress control is displayed, and the element is hidden in the event handler of the endrequest.
You must provide the client script to display or hide the updateprogress control in the following cases:

    • It is not associated with the updateprogress control during the sending back of an asynchronous send-back trigger registered as an update panel.
    • In this case, the updateprogress control cannot automatically determine that asynchronous sending back has been triggered.


3.8 Other attributes
Displayafter:
Specify the delay time displayed by the updateproress control in milliseconds.


4. Summary
So far, Asp. net Ajax Extensions 1.0 has completed learning several server controls. Using these server controls, we can develop a web application with basic Ajax features, provide users with a better client experience.

Related Article

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.