Showing posts with label AJAX. Show all posts
Showing posts with label AJAX. Show all posts

Saturday, December 16, 2006

ASP.NET AJAX Overview

Introduction

Microsoft ASP.NET AJAX enables you to quickly create Web pages that include a rich user experience with responsive and familiar user interface (UI) elements. ASP.NET AJAX provides client-script libraries that incorporate cross-browser ECMAScript (JavaScript) and dynamic HTML (DHTML) technologies, and it integrates them with the ASP.NET 2.0 server-based development platform. Using ASP.NET AJAX, you can improve both the user experience and the efficiency of your Web applications.

Why Use ASP.NET AJAX?

ASP.NET AJAX enables you to build rich Web applications that have many advantages over Web applications that are completely server-based. ASP.NET AJAX applications offer:

  • Improved efficiency by performing significant parts of a Web page's processing in the browser.
  • Familiar UI elements such as progress indicators, tooltips, and pop-up windows.
  • Partial-page updates that refresh only the parts of the Web page that have been updated.
  • Client integration with ASP.NET application services for forms authentication and user profiles.
  • Integration of data from different sources through calls to Web services.
  • A framework that simplifies customization of server controls to include client capabilities.
  • Support for the most popular and commonly used browsers, including Microsoft Internet Explorer, Mozilla Firefox, and Apple Safari.

ASP.NET AJAX Architecture

ASP.NET AJAX consists of client-script libraries and of server components that are integrated to provide a robust development framework. In addition to ASP.NET AJAX, you can use the ASP.NET AJAX Control Toolkit and the community-supported features in the ASP.NET AJAX Futures releases.

ASP.NET AJAX Server Components

The ASP.NET AJAX server components consist of ASP.NET controls and components to manage the UI and flow of an application, and to manage serialization, validation, control extensibility, and so on. There are also ASP.NET Web services that enable you to access ASP.NET application services for forms authentication and user profiles.

ASP.NET AJAX Server Controls

The ASP.NET AJAX server controls consist of server and client code that integrate to produce AJAX-like behavior. The following list describes the most frequently used ASP.NET AJAX server controls.

  • ScriptManager
    Manages script resources for client components, partial-page rendering, localization, globalization, and custom user scripts. The ScriptManager control is required in order to use the UpdatePanel, UpdateProgress, and Timer controls.
  • UpdatePanel
    Enables you to refresh selected parts of the page instead of refreshing the whole page by using a synchronous postback.
  • UpdateProgress
    Provides status information about partial-page updates in UpdatePanel controls.
  • Timer
    Performs postbacks at defined intervals. You can use the Timer control to post the whole page, or together with the UpdatePanel control to perform partial-page updates at a defined interval.

ASP.NET AJAX Web Services

ASP.NET AJAX exposes ASP.NET application services for forms authentication and user profiles to client script by using Web services. This enables you to help protect resources by using forms authentication and to persist user-specific settings on the server by using client script. In addition, ASP.NET AJAX includes network components that make it easy to return results from any Web service call.
For information and examples, see Asynchronous Communication Layer Overview and ASP.NET Application Services Tutorials.

ASP.NET AJAX Server Control Extensibility

ASP.NET AJAX enables you to create custom ASP.NET AJAX server controls that include client behaviors. For information and examples, see the ASP.NET AJAX Extensibility tutorials and the Microsoft ASP.NET AJAX Control Toolkit.

ASP.NET AJAX Client Components

The ASP.NET AJAX client-script libraries consist of JavaScript (.js) files that provide features for object-oriented development. This has not been previously available to JavaScript developers. The object-oriented features included in the ASP.NET AJAX client-script libraries enable a new level of consistency and modularity in client scripting. The following layers are included in the ASP.NET AJAX script libraries:

  1. A browser compatibility layer.
    This provides compatibility across the most frequently used browsers (including Microsoft Internet Explorer, Mozilla Firefox, and Apple Safari) for your ASP.NET AJAX scripts.
  2. ASP.NET AJAX core services,
    which include extensions to JavaScript, such as classes, namespaces, event handling, inheritance, data types, and object serialization.
  3. An ASP.NET AJAX base class library,
    which includes components such as string builders and extended error handling.
  4. A networking layer
    that handles communication with Web-based services and applications, and that manages asynchronous remote method calls.

ASP.NET AJAX Control Toolkit

The ASP.NET AJAX Control Toolkit is a collection of samples and components that show you some of the experiences you can create with rich client ASP.NET AJAX controls and extenders. The Control Toolkit provides both samples and a powerful SDK to simplify creating and reusing your custom controls and extenders.

ASP.NET AJAX Community-supported Futures Releases

The ASP.NET AJAX community-supported Futures releases provide features that extend the core ASP.NET AJAX platform with functionality that remains under development and is not included in the Microsoft ASP.NET AJAX release. This includes additional extender controls, support for client declarative syntax (xml-script), and more.

ASP.NET AJAX Partial-Page Rendering Overview

Introduction

Partial-page rendering removes the need for the whole page to be refreshed as the result of a postback. Instead, only individual regions of the page that have changed are updated. As a result, users do not see the whole page reload with every postback, which makes user interaction with the Web page more seamless. Microsoft ASP.NET 2.0 AJAX Extensions enables you to add partial-page rendering to new or existing ASP.NET Web pages without writing client script.

Scenarios

ASP.NET 2.0 AJAX Extensions enables you to extend existing ASP.NET 2.0 applications and develop new ones that incorporate AJAX (Asynchronous JavaScript and XML) functionality. Use ASP.NET 2.0 AJAX Extensions when you want to do the following:

  • Improve the user experience with Web pages that are richer, that are more responsive to user actions, and that behave like traditional client applications.
  • Reduce full-page refreshes and avoid page flicker.
  • Enable cross-browser compatibility without writing client script.
  • Perform AJAX-style client/server communication without writing client script.
  • Use the controls and components from the ASP.NET AJAX Control Toolkit.
  • Develop custom Microsoft ASP.NET AJAX controls.

Partial-Page Rendering Features

Partial-page rendering relies on server controls in ASP.NET 2.0 AJAX Extensions and on client functions in the Microsoft AJAX Library. You do not have to use the Microsoft AJAX Library to enable partial-page rendering, because this functionality is provided automatically when you use the ASP.NET 2.0 AJAX Extensions server controls.

The primary features of Microsoft ASP.NET AJAX partial-page rendering include the following:

  • A declarative model that works like ASP.NET server controls. In many scenarios, you can specify partial-page rendering using only declarative markup.
  • Server controls that perform the underlying tasks required for partial-page updates. These include the ScriptManager control and the UpdatePanel control.
  • Integration between ASP.NET 2.0 AJAX Extensions server controls and the Microsoft AJAX Library for common tasks. These tasks include enabling users to cancel a postback, displaying custom progress messages during an asynchronous postback, and determining how multiple clicks are processed.
  • Error-handling options for partial-page rendering, which enable you to customize how errors are displayed in the browser.
  • Cross browser compatibility, which is built into the Microsoft AJAX Library. Simply using the server controls automatically invokes the correct browser functionality.

Server Controls for Partial-Page Updates

To add AJAX functionality to ASP.NET Web pages, you identify individual sections of the page that you want to update. You then put the content of these sections into UpdatePanel controls. The contents of an UpdatePanel control can be HTML or other ASP.NET controls. You can add an UpdatePanel control to the page as you would any other control.

By default, postbacks originating from controls inside the update panel (child controls) automatically initiate asynchronous postbacks and cause a partial-page update. You can also specify that controls outside the UpdatePanel cause an asynchronous postback and that they refresh the UpdatePanel control's content. A control that causes an asynchronous postback is referred to as a trigger.

An asynchronous postback behaves much like a synchronous postback. All the server page life-cycle events occur and view state and form data are preserved. However, in the rendering phase, only the contents of theUpdatePanel control are sent to the browser. The rest of the page remains unchanged.

To support partial-page rendering, you must put a ScriptManager control on the page.
The ScriptManager control:

  1. keeps track of all the update panels on the page and their triggers.
  2. coordinates partial-page rendering behavior on the server.
  3. determines which sections of the page to render as a result of an asynchronous postback.

Enabling Partial-Page Rendering Support

You enable or disable partial-page rendering for a page by setting the EnablePartialRendering property of the ScriptManager control.
You can also specify whether partial-page rendering is supported for a page by setting the SupportsPartialRendering property of the ScriptManager control.
If you do not set the SupportsPartialRendering property and if the EnablePartialRendering property is true (which is the default), the capabilities of the browser are used to determine whether partial-rendering is
supported.

If partial-page rendering is not enabled for a page, if it has been disabled, or if it is not supported in a browser, the page uses fallback behavior. Actions that ordinarily would perform an asynchronous postback instead perform a synchronous postback and update the whole page. Any UpdatePanel controls on the page are ignored, and their contents are rendered as if they were not inside an UpdatePanel control.

Monday, October 23, 2006

The 1st wave of Microsoft ASP.NET AJAX Control to master

There are and will be many and many AJAX controls, some of them are the essentials and the mostly used. 主要是关于Panel的“基层”control,我称之为“Panel Group”吧。Thus, learn to use them in the first wave:

d UpdatePanel

这个是最基本的。专门研究吧。

d PopupControl
PopupControl is an ASP.NET AJAX extender that can be attached to any control in order to open a popup window that displays additional content.
This popup window will probably be interactive and will probably be within an ASP.NET AJAX UpdatePanel, so it will be able to perform complex server-based processing (including postbacks) without affecting the rest of the page.
The popup window can contain any content, including ASP.NET server controls, HTML elements, etc..
Once the work of the popup window is done, a simple server-side call dismisses it and triggers any relevant script on the client to run and update the page dynamically.
^ 这是个基本的control,也是比较原始意义的AJAX功能,用途比较广泛。比如填写某个TextBox的时候,可以探出一个小Panel用于选择日期,计算某些数等等。

d HoverMenu
HoverMenu is an ASP.NET AJAX extender that can be attached to any ASP.NET WebControl, and will associate that control with a popup panel to display additional content.
^ 我觉得HoverMenu这个名字起得不好,不如叫HoverPopupPanel。这种功能倒是会用得挺多,比如用于当鼠标滑到某个位置的时候,弹出一个圆角小方框显示文字。

d CollapsiblePanel
The CollapsiblePanel is a very flexible extender that allows you to easily add Collapsible sections to your web page. This extender targets any ASP.NET Panel control.
The page developer specifies which control(s) on the page should be the open/close controller for the panel, or the panel can be set to automatically expand and/or collapse when the mouse cursor moves in or out of it, respectively.

d Accordion
The Accordion is a web control that allows you to provide multiple panes and display them one at a time. It is like having several CollapsiblePanels where only one can be expanded at a time.
The Accordion is implemented as a web control that contains AccordionPane web controls. Each AccordionPane control has a template for its Header and its Content. We keep track of the selected pane so it stays visible across postbacks.

d DynamicPopulate
DynamicPopulate is a simple extender that replaces the contents of a control with the result of a web service or page method call. The method call returns a string of HTML that is inserted as the children of the target element.
^ 这应该最原始意义上的AJAX功能。

Using the UpdatePanel Control

e UpdatePanel Overview
e Using the UpdatePanel Control in ASP.NET AJAX Applications

Microsoft ASP.NET AJAX 1.0 Beta Just Released!

非常高兴Microsoft ASP.NET AJAX 1.0 Beta终于发布了。虽然此前基于Altas写了不少代码,我还是很愿意告别Prince Atlas,修改到新的ASP.NET AJAX上来。

我认为,AJAX虽然目前看来似乎是一种新技术,有一点独立性,但最终而且不久就会完全融合进ASP.NET中,成为ASP.NET 3.0,的基本属性。我们不会再特意安装AJAX包,也不需要在aspx文件中特别声明什么,因为它已经是ASP.NET的native and default features。在开发中使用AJAX feature,我们也不会看到很特殊的AJAX的标签,因为提供AJAX功能的标签都会统一在asp下。

其实,在目前的ASP.NET 2.0中,我们就已经能够看到一些默认的AJAX feature了。比如GridView中的sorting,paging等feature。而且会在ASP.NET页面的Page命令中找到一个叫Async的attribute,这就是用来启动Asyncronous功能的。

在未来的版本(ASP.NET 3.0)中,我预计AJAX相关的功能和feature会被统一规划,完全融合进ASP.NET的血液中,消失得无影踪。你将不再能找到AJAX,你只会看到被注入新的血液的ASP.NET。

我非常喜欢Microsoft ASP.NET AJAX的另一个原因是其使用方式。不像Ruby on Rails那样需要在RHTML中写很多看起来有些奇怪的代码,也不需要像Google Web Toolkit那些通过写Java代码来获得AJAX功能。在Microsoft ASP.NET AJAX中,我们只需要通过写标签的方式通过Server Control来实现出色的AJAX功能。也就是通过Declarative Programming的方式来快速地实现AJAX,就如同使用普通的ASP.NET Server Control一样。当然,这个问题实质上是关于Declarative Programming和Imperetive Programming两种开发流派孰优何优。

总之,对于使用过Ruby on Rails,Google Web Toolkit和Microsoft ASP.NET AJAX的我来说,我更喜欢Microsoft ASP.NET AJAX,因为它符合我对Declarative Programming的倾向性以及我对productivity(高生产效率)的强烈需求。