Updatepanel control [go to Lao Zhao's blog]

Source: Internet
Author: User
Updatepanel

ForUpdatepanelThe use of controls is an important part of ASP. NET Ajax Extentions. We have receivedUpdateprogressA large amount of user feedback on controls. In order to enhance the local refresh function, we made multiple modifications and enhancedUpdatepanelControl compatibility. We have also implemented a wide range of event models for asynchronous poskback, so that you can respond to them on the client and provide additional operations for page updates.

Scriptmanager Control

In the RTM version,ScriptmanagerThere isEnablepartialrenderingAttribute. The default value isTrue, Which reduces the usageUpdatepanelThe steps required to perform asynchronous partial page refresh.

To reduce the complexity of controls,ScriptmanagerOfErrortemplateThe property is removed in the RTM version. Now the error processing model becomes more flexible. For example, you can create an independent server control for it. You can also useScriptmanagerOfAsyncpostbackerrormessageAttribute, but it only sets the default error information. If you need to dynamically customize the error information, you can useAsyncpostbackerrorEvent.

NowScriptmanagerA new property is exposed.AsyncpostbacktimeoutTo control the timeout of asynchronous PostBack.

It is worth mentioning that the server control may be used currentlyScriptmanager. This method addsUpdatepanelAnd reduces the numberUpdatepanelComplexity. The current resources include scripts, style sheets, and hidden fields.ClientscriptmanagerThe method in corresponds to the above method. They can accept a control instance as a parameter, so that ifUpdatepanelUsing these controls, the scripts they need can be correctly tracked.

Dynamic updatepanel controls

There are two ways to dynamically addUpdatepanelThis is the biggest improvement in the RTM version. Usage DynamicsUpdatepanelThe method is:

    • Developers who write custom controls can nowUpdatepanelAdd the widget to the widget. In this way, as long as the page existsScriptmanagerAnd itsEnablepartialrenderingSetTrueIn this way, you can use the custom control and get a local refresh experience. In addition, if noScriptmanagerIn the traditional PostBack model.
    • Page developers can addUpdatepanel.

The following example shows how to useUpdatepanelControl.Protected Override VoidCreatechildcontrols (){
Base. Createchildcontrols ();

Scriptmanager Sm = Scriptmanager. getcurrent (PAGE );
Control parent;
Control container;
If (Sm =   Null   |   ! SM. enablepartialrendering ){
// If not doing partial rendering, use
// Dummy control as the container.
Parent = Container =   New Control ();
}
Else {
// Create an updatepanel control.
Updatepanel up =   New Updatepanel ();

// Instead of adding child controls directly
// The updatepanel control, add them to its
// Contenttemplatecontainer.
Container = Up. contenttemplatecontainer;
Parent = Up;
}

Adddatacontrols (container );
Controls. Add (parent );
}

Client events during asynchronous postbacks

In the CTP version, the client pagerequestmanager Object relies on the XMLHttpRequest object to Implement Asynchronous poskback and Process response . In RTM, the pagerequestmanager Object provides an asynchronous poskback lifecycle event. You can use them to customize the request and response processing methods. The following are available client events and the parameter information required for the event:

    • Initializerequest: You can use this event to cancel the asynchronous PostBack request to be sent. It also allows you to do some additional work based on the PostBack information. The parameter of this event isInitializerequesteventargsType.
    • Beginrequest: You can use this event to start some work. For example, you can display progress in this event andEndrequestThe event is hidden. The parameter of this event isBeginrequesteventargs.
    • Pageloding: You can useUpdatepanelTo be updated or deleted for some additional work, such as releasing resources. You can also check the custom information sent by the server in response to this event to perform some custom work. The parameter of this event isPageloadingeventargsType.
    • Pageloaded: This event andPageloadingEvent similarity, which providesUpdatepanel. The parameter of this event isPageloadedeventargsType.
    • Engrequest: You can use this event to customize the error handling method and process additional information sent by the server. You can use it to hideUpdateprogressControl. The parameter of this event isEndrequesteventargsType.

Developing controls compatible with the updatepanel Control

In the CTP version,UpdatepanelControls process many output objects, includingUpdatepanelAnd then complete updates on the page. This makes some controls unable to matchUpdatepanelCompatible. For example, in the CTP versionUpdatepanelIf you dynamically add ASP. NET verification controls, they will not work correctly.WizardIt is particularly common to verify user input in each step of the control.

Changed in RTM versionUpdatepanel. You can use the same method to register a script class libraryScriptmanagerRegister the script or data that will be sent to the client. A new set of ASP. NET validation controls are included in the RTM version. They use their own scriptsScriptmanagerRegister. The tag names of these new controls correspond to the original authentication controls of ASP. NET. Therefore, you do not need to change the authentication controls declared on the page. However, ifUpdatepanelIf the verification control is used internally, you need to changeCodeTo use the new control.

The following example shows compatibility in the RTM version.Updatepanel. As follows:Protected Override VoidOnprerender (eventargs e ){
Base. Onprerender (E );

Control=Findcontrol (_ controlid );

// Register scripts with new scriptmanager APIs.
// The scripts hook up new pagerequestmanager events.
String Script = String. Format (
Cultureinfo. invariantculture,
@" VaR {0} _ hover =
New Microsoft. samples. hoverextender (document. getelementbyid ('{1}'), '{2 }');
{0} _ hover. Attach (); " ,
Clientid,
Control. clientid,
Colortranslator. tohtml (backgroundcolor ));

Scriptmanager. registerclientscriptinclude (
This , Typeof (Hoverextender ), " Hoverextenderscript " ,
Resolveclienturl ( " ~ /Scriptlibrary/hoverextender. js " ));
Scriptmanager. registerstartupscript (
This , Typeof (Hoverextender), clientid, script, True );
}

Sending additional data to the client

In the CTP version, it is difficult to implement a function, that is, after the asynchronous poskback page, update the control outside the updatepanel based on the data received from the server. In the RTM version, you can call the scriptmanager method to register and output data to the page to solve this problem.

Imagine if you need to use the server code to change the value of the interval and enabled attribute of the client's timer control, but the timer is not in updatepanel. This is not possible in the CTP version.

In the RTM version,ScriptmanagerSaves a dictionary object in the server segment. You can useRegisterdataitemMethod to update and register objects. This dictionary will be sent to the client. You canPageloading,PageloadedAndEndrequestEvent passedEventargs. get_dataitems ()Method to obtain the dictionary object.

the following example shows how to register data: /// server control code.
...
Public int interval {
Get {...}
set {< br> _ DATA = value;
...
}< BR >}

VoidPrerender (){
Scriptmanager SM1=Scriptmanager. getcurrent (PAGE );
If(SM1! = Null &&Sm1.isinasyncpostback ){
Scriptmanager. registerdataitem (This, _ Data. tostring ());
}

// The control also needs to register script to handle
// Endrequest event on the client and retrieve this value.
// The script below adds a handler for the current instance
// Of the pagerequestmanager object and callthe
// Get_dataitem () method from eventargs.
Scriptmanager. registerclientscriptblock ( This , This . GetType (), key, script)
}

Comment

The above code is most interesting, probably the last line. Its function is to register an endrequest handler in the pagerequestmanager object of the client for some modifications or other work. In fact, with this method, even if the dataitem support is not output to the client, the client object can be operated. With the dataitem function, it may be more important to separate the server code from the client code for centralized maintenance.

Custom error handling and redirection

In the CTP version, there is no control error method or custom error settings. This problem is solved in the RTM version.

InScriptmanagerThe object provides an attribute:Allowcustomerror. When this attribute is setFalse,ScriptmanagerThe object will overwrite the custom error jump and send the error information to the client, so that you can display the error information to avoid page redirection to other places.

In the RTM version, an additionalRedirdbmsModule to control page redirection. Therefore, the RTM version can handle cross-page posting.

Triggers

In the CTP version,ScriptmanagerControl usedControlvaluetriggerAndControleventtriggerType, and store them in a trigger collection to bind these triggers to the control on the page. In the RTM version, the two are centralized into one type:AsyncpostbacktriggerTo avoid the possible confusion caused by the previous two triggers.

Based on user feedback, we addedPostbacktriggerObject, which providesUpdatepanelThe ability to generate full (synchronous) PostBack pages internally. ThisTriggerThe object can now be implementedIpostbackeventhandler,IpostbackdatahandlerOrInamingcontainerInterface controls.

AsyncpostbacktriggerEnableUpdatepanelTrigger asynchronous PostBack update. This trigger can also pointUpdatepanelAn external control, or a parent control pointing to the control's hierarchy. When a control that acts as a naming container is specified as a trigger, all the controls inside it cause the same poskback as the trigger.

The following example shows Asyncpostbacktrigger How to Use object declaration: < ASP: button Runat = "Server" ID = "Button1" Text = "Go"   />
< ASP: updatepanel ID = "Up1" Updatemode = "Conditional" Runat = "Server" >
< Contenttemplate >... </ Contenttemplate >
< Triggers >
< ASP: asyncpostbacktrigger Controlid = "Button1"   />
</ Triggers >
</ ASP: updatepanel >

OnePostbacktriggerCan point toUpdatepanelInternal control, so that it can generate a common PostBack. These controls must be internal controls of the current updatepanel.

Updateprogress Control

Enhanced in the RTM versionUpdateprogressControl, so that it has an additional function: specify a time interval, only after the asynchronous PostBack exceeds this time to display the progress control. You can also control the output of updateprogress to control whether the control occupies the page space when hidden, just like setting the ASP. NET verification control'sDisplaymodeSame attributes. In addition, you can add several lines of code to add a cancel function for the Progress UI.

the following example shows how to set the updateprogress control so that it is displayed only after the PostBack is over half a second (500 milliseconds):

working on request...


<SCRIPT type = "text/JavaScript">
Function abortpb (){
VaR OBJ = SYS. webforms. pagerequestmanager. getinstance ();
If (obj. get_isinasyncpostback ()){
OBJ. abortpostback ();
}
}
</SCRIPT>

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.