Real World ASP.NET AJAX

Donald Hoimason Incorporated

donald.ho@imason.com

Scott HowlettMicrosoft Regional Directorscott.howlett@imason.com

Where Are We?

What's New for Web Developers in ASP.NET and Visual

Studio 2008

An Overview of Microsoft Silverlight

Developing ASP.NET AJAX Controls with

Silverlight

Agenda

OurFaves.com OverviewA Data-bound ScenarioArchitectureData-bound Scenario & DemoUpdate Panel & DemoUpdate Panel+ & DemoOther Microsoft AJAX framework ControlsMaking your own web service callsRendering controls with a web servicePutting it all together

OurFaves.com

Demonstration

OurFaves.com

Agenda

A Data-Bound Scenario

We want to show a list of items with associated dataEach “fave” list item contains the following:

TextHyperlinksPicturesASP.NET postback functionalityJavascript functionality

Example: Sounds like a job suited to a customized data-bound list – the ASP.NET Repeater

Agenda

OurFaves.com OverviewA Data-bound ScenarioArchitectureData-bound Scenario DemoUpdate Panel & DemoUpdate Panel+ & DemoOther Microsoft AJAX framework ControlsMaking your own web service callsRendering controls with a web servicePutting it all together

A Typical Data-bound ScenarioOverview of Architecture

3-Tier Model: Presentation Tier, Business Logic Tier and Data Tier1 Caveat: Extra Web services layer for AJAX, which will get into laterWe will only examine the Web Services and Presentation tiers

DatabasePresentationTier

Business LogicTier

Web ServicesTier

Agenda

OurFaves.com OverviewA Data-bound ScenarioArchitectureData-bound Scenario DemoUpdate Panel & DemoUpdate Panel+ & DemoOther Microsoft AJAX framework ControlsMaking your own web service callsRendering controls with a web servicePutting it all together

Demonstration

Repeater in a Data-bound Scenario

Agenda

Update Panel

The core control of the Microsoft Ajax FrameworkAllows for a partial page refresh – meaning only the sections of the page you specify will be refreshedHow it works: Queue up the demo!

Demonstration

UpdatePanel Control

Agenda

UpdatePanel ControlAdditional Features

Also allows for customizability in its behaviour and how partial postbacks are triggeredBy default, postbacks within an UpdatePanel trigger a partial page refreshTriggers outside the UpdatePanel may also fire the partial page refresh

Demonstration

UpdatePanel Control with Additional Features

Agenda

Other ASP.NET AJAX ControlsASP.NET Futures & Toolkit

Aside from the UpdatePanel control, which is contained in the base release, there are many controls available separately from the ASP.NET Futures and ASP.NET AJAX ToolkitThese include the AutoComplete, Calendar, and HoverMenu controlsYou can find these at ajax.asp.net

Agenda

Making Your Own Web Service Calls

In addition to the controls available out of the box, there is the capability to build your own AJAX functionalityThis is aided greatly by the AJAX framework, specifically the ScriptManager control, which enables you to call strongly-typed Web services from JavaScriptThis means there is no need to write your own code to handle the Web service call, it has nearly all been done for you

Making Your Own Web Service CallsWhy Make Your Own Calls?

Though the UpdatePanel and other controls, ASP.NET AJAX does offer a powerful way to make AJAX calls there are two main reasons to make your own calls:

1. There is some inherent performance overhead when using an UpdatePanel control as compared with a traditional AJAX callPerformance hit due to data passed in a normal ASP.NET postback such as viewstate is also passed in a partial page postback

2. Sometimes, the built-in controls do not have required functionality

Agenda

Controls and Web Services

Question: So how can you make a Web service call and continue to use your written controls?Scott Guthrie made a useful post in his blog to solve this exact problemThe code described in his post renders a control during the Web service call and returns HTML for the JavaScript to bind to your presentation elementCode can be found at his blog (weblogs.asp.net/scottgu)

Agenda

Demonstration

Viewmanager & AJAX without an UpdatePanel Control

Coming Up Next!

What’s New for Web Developers in ASP.NET and Visual

Studio 2008

An Overview of Microsoft Silverlight

Developing ASP.NET AJAX Controls with

Silverlight

Your Feedback Matters!

Your evaluation form will be delivered to you via email after the event (save paper!)The email will come from wwevents@microsoft.comEveryone who completes an evaluation is entered to win an Xbox 360Feedback will be used to improve the event for next year

Real World ASP.NET AJAX

Documents

Transcript of Real World ASP.NET AJAX

TabStrip for ASP.NET AJAX

Integrating ASP.NET AJAX with SharePoint

Introduction To Asp.Net Ajax

ASP.NET AJAX with Web Services

ASP.net AJAX for Developers

ASP.NET AJAX Basics

The ASP.NET AJAX Extensions

Ajax & ASP.NET 2

Developing great applications using ASP.NET MVC and ASP.NET AJAX

ASP.NET - AJAX Security and Reporting

ASP.NET Ajax Supplementary Tutorial. Why Use ASP.NET AJAX? - I ASP.NET AJAX enables you to build rich Web applications that have many advantages over.

ASP.net Ajax and Javascript

ASP.NET AJAX – Basics

ASP.NET 4 and AJAX

{Community} Launch Asp.Net Ajax

ComponentOne Expander for ASP.NET AJAX

AJAX with ASP.NET MVC

What’s new in ASP.NET 3.5?...ASP.NET AJAX v1.0 works on ASP.NET 2.0 and VS 2005 Shipped in Jan as separate download Delivers core ASP.NET AJAX foundation All ASP.NET AJAX 1.0 features

Scheduler for ASP.NET AJAX - ComponentOne

Ventsislav Popov Crossroad Ltd.. 1. What is AJAX? AJAX Concept ASP.NET AJAX Framework 2. ASP.NET AJAX Server Controls ScriptManager, UpdatePanel.