
ASP.NET AJAX is a framework from Microsoft for creating interactive Web applications using AJAX that work across all popular browsers. ASP.NET AJAX is built-into ASP.NET 3.5. It is also available as a separate download for ASP.NET 2.0.
Essential Studio 2008 Volume 2 provides integrated support for ASP.NET AJAX across a wide range of products.
Update Panel
ASP.NET UpdatePanel controls enable you to build rich, client-centric Web applications. By using UpdatePanel controls, you can refresh selected parts of the page instead of refreshing the whole page with a postback. This is referred to as performing a partial-page update. A Web page that contains a ScriptManager control and one or more UpdatePanel controls can automatically participate in partial-page updates, without custom client script.
How does it work?
UpdatePanel controls works, by specifying the regions of a page, that can be updated, without refreshing the whole page. This process is coordinated by the ScriptManager server control and the client PageRequestManager class. When partial-page updates are enabled, controls can asynchronously post to the server. An asynchronous postback behaves like a regular postback. In that, the resulting server page executes the complete page and controls the life cycle. However, with an asynchronous postback, page updates are limited to regions of the page, that are enclosed in UpdatePanel controls and that are marked to be updated. The server sends HTML markup for only the affected elements to the browser.
In the browser, the client PageRequestManager class performs Document Object Model (DOM) manipulation, to replace the existing HTML with updated markup. The following illustration shows a page that is loaded for the first time, and a subsequent asynchronous postback, that refreshes the content of an UpdatePanel control.
How UpdatePanel Controls are refreshed?
The following list describes the property settings of the UpdatePanel control that determine, when a panel's content will be updated during partial-page rendering.
- If the UpdateMode property is set to Always, the UpdatePanel control’s content is updated on every postback that originates from anywhere on the page. This includes asynchronous postbacks from controls, that are inside other UpdatePanel controls, and the postbacks from controls, that are not inside UpdatePanel controls.
- If the UpdateMode property is set to Conditional, the UpdatePanel control’s content is updated when one of the following is true.
- When the postback is caused by a trigger for that UpdatePanel control.
- When you explicitly call the UpdatePanel control's Update() method.
- When the UpdatePanel control is nested inside another UpdatePanel control and the parent panel is updated.
- When the ChildrenAsTriggers property is set to true and any child control of the UpdatePanel control causes a postback. Child controls of nested UpdatePanel controls do not cause an update to the outer UpdatePanel control unless they are explicitly defined as triggers for the parent panel.
If the ChildrenAsTriggers property is set to false and the UpdateMode property is set to Always, an exception is thrown. The ChildrenAsTriggers property is intended to be used only when the UpdateMode property is set to Conditional.
Enhancements based on AJAX
The Syncfusion Essential studio make use of Class named ScriptResourceAttribute which can be used to define a resource in an assembly to be used from a client script file.
Then the resource files which are all used in the Syncfusion Controls will be gzipped and served over the network. The following screenshot shows this.
In order to achieve this, we need to set the following attributes in the project's web.config file.
<system.web.extensions/>
. . .
<scripting>
<ScriptResourceHandler enableCompression=”true” enableCaching=”true” />
</scripting>
. . .
</system.web.extensions>
As the resource files gets gzipped,
- It saves the precious network band-width.
- It reduces the load-time. As a result, the webform which consists of Syncfusion controls will get loaded more faster on the client browser.
- It also reduces the network traffic.
Using Syncfusion Controls with UpdatePanel
Essential Studio 2008 Volume 2 provides integrated support for ASP.NET AJAX across a wide range of products. Syncfusion Essential studio web controls are fully-compatible with Update Panel.
The following are the steps involved in using Syncfusion Controls with Updatepanel.
I. Configure the Web Application
When you create a new AJAX-enabled Web site, you can use the Web.config file provided in the installation package to add the required configuration settings. In Visual Studio, the Web.config file for Microsoft ASP.NET AJAX is included in your project, when you create a new ASP.NET AJAX-enabled Web Site.
If you have to manually add the Web.config file to a new Web site, you can get a copy of it from the installation path. By default, the file is in the following location.
drive:\Program Files\Microsoft ASP.NET\ASP.NET 2.0 AJAX Extensions\v1.0.xxxx
II. Add ScriptManager control to the form
Just drag and drop the script manager control from the visual studio toolbox to the web page. Then set its, EnablePartialRendering to True.
III. Add update panel and place the Syncfusion controls inside that panel.
To enable partial page rendering, set the Syncfusion controls EnableCallback to False and AutoPostBack to True.
|