ASP.NET AJAX in Action phần 1 pot

ASP.NET AJAX in Action

ASP.NET AJAX
in Action
ALESSANDRO GALLO
DAVID BARKOL
RAMA KRISHNA VAVILALA
MANNING
Greenwich
(74° w. long.)
For online information and ordering of this and other Manning books, please visit
www.manning.com. The publisher offers discounts on this book when ordered in quantity.
For more information, please contact:
Special Sales Department
Manning Publications Co.
Sound View Court 3B fax: (609) 877-8256
Greenwich, CT 06830 email:
©2008 by Manning Publications Co. All rights reserved.
No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in
any form or by means electronic, mechanical, photocopying, or otherwise, without prior written
permission of the publisher.
Many of the designations used by manufacturers and sellers to distinguish their products are
claimed as trademarks. Where those designations appear in the book, and Manning
Publications was aware of a trademark claim, the designations have been printed in initial caps
or all caps.
Recognizing the importance of preserving what has been written, it is Manning’s policy to have
the books we publish printed on acid-free paper, and we exert our best efforts to that end.
Manning Publications Co. Copyeditor: Tiffany Taylor
Sound View Court 3B Typesetter: Gordan Salinovic
Greenwich, CT 06830 Cover designer: Leslie Haimes

ISBN 1-933988-14-2
Printed in the United States of America
12345678910–MAL –13121110090807
To those who wait
—A.G.

To my wife and best friend, Emily
—D.B.

To my parents, for making me who I am!
—R.K.V.

vii
brief contents
PART 1ASP.NET AJAX BASICS 1
1
■
Introducing ASP.NET AJAX 3
2
■
First steps with the Microsoft Ajax Library 36
3
■
JavaScript for Ajax developers 73

4
■
Exploring the Ajax server extensions 114
5
■
Making asynchronous network calls 141
6
■
Partial-page rendering with UpdatePanels 194
PART 2ADVANCED TECHNIQUES 229
7
■
Under the hood of the UpdatePanel 231
8
■
ASP.NET AJAX client components 264
9
■
Building Ajax-enabled controls 299
10
■
Developing with the Ajax Control Toolkit 332
viii BRIEF CONTENTS
PART 3ASP.NET AJAX FUTURES 371
11
■
XML Script 373
12
■
Dragging and dropping 410

PART 4MASTERING ASP.NET AJAX 441
13
■
Implementing common Ajax patterns 443
ix
contents
forewords xvii
preface xxi
acknowledgments xxiii
about this book xxv
about the authors xxxi
about the title xxxii
about the cover illustration xxxiii
PART 1 ASP.NET AJAX BASICS 1
1
Introducing ASP.NET AJAX 3
1.1 What is Ajax? 4
Ajax components 5
■
Asynchronous web programming 7
The XMLHttpRequest object 10
■
Ajax development issues 14
1.2 ASP.NET AJAX architecture 15
Client framework 16
■
Server framework 19
■
Client-centric
development model 20

■
Server-centric development model 21
ASP.NET AJAX goals 22
1.3 ASP.NET AJAX in action 23
Simple server-centric solution 23
■
UpdateProgress control 28
Simple client-centric example 30
1.4 Summary 34
x CONTENTS
2
First steps with the Microsoft Ajax Library 36
2.1 A quick overview of the library 37
Library features 37
■
Ajax-enabling an ASP.NET
page 39
■
Script versions 40
2.2 The Application model 42
Client components 43
■
Client-page lifecycle 44
■
“Hello
Microsoft Ajax!” 45
2.3 Working with the DOM 48
The abstraction API 48
■
A dynamic, cross-browser text box 49

CSS and positioning 53
■
Client delegates 54
$addHandlers and $clearHandlers 56
■
Callbacks 57
2.4 Making development with JavaScript easier 58
The String object 58
■
Sys.StringBuilder 59
■
The Array
object 61
■
Globalization 63
■
Browser detection 65
Debugging 66
■
Typed errors 69
2.5 Summary 72
3
JavaScript for Ajax developers 73
3.1 Working with objects 74
Objects 75
■
Arrays 76
■
Functions 77
■

Creating custom
objects 81
■
The prototype object 82
■
Extending a JavaScript
type 83
■
Literals 85
3.2 Working with JSON 86
JSON structures 86
■
JSON and the Microsoft Ajax Library 88
3.3 Classes in JavaScript 89
Client classes 89
■
The registerClass method 90
Properties 91
■
Namespaces 93
3.4 Understanding inheritance 95
Prototype-based inheritance 95
■
Passing arguments to the base
class 97
■
Overrides 98
3.5 Understanding interfaces and enumerations 99
Interfaces 99
■

Enumerations 101
3.6 Using type reflection 104
Reflection methods 104
■
Object typing 105
■
Building
a simple class browser 106
CONTENTS xi
3.7 Working with events 108
Exposing an event 109
■
Subscribing to and
handling events 112
3.8 Summary 113
4
Exploring the Ajax server extensions 114
4.1 Ajax for ASP.NET developers 115
What are the Ajax server extensions? 115
4.2 Enhancing an existing ASP.NET site 116
A sample ASP.NET site 117
■
Configuring an existing
ASP.NET site 118
4.3 ScriptManager: the brains of an Ajax page 120
Understanding the ScriptManager 121
■
Deploying
JavaScript files 122
■

Registering services 123
Localization 124
■
Using the
ScriptManagerProxy 126
4.4 Partial-page updates 127
Introducing the UpdatePanel control 128
■
More
UpdatePanels 131
■
Insert feedback here 133
■
Working
with a timer 135
■
Error handling 138
4.5 Summary 140
5
Making asynchronous network calls 141
5.1 Working with ASP.NET Web Services 142
Configuring a web service 143
■
Invoking web service
methods from JavaScript 146
■
Managing complex
types 150
■
Using HTTP GET 158

Page methods 159
5.2 The asynchronous communication layer 160
A simple WebRequest 161
■
The executor 162
WebRequestManager 163
■
Handling errors 163
5.3 Consuming external Web Services 166
The script technique 167
■
Cross-domain calls through the
server 168
■
Mash-it-up with ASP.NET AJAX 169
Bridges 175
xii CONTENTS
5.4 Using ASP.NET application services 183
Enabling ASP.NET application services 183
■
Authentication
service 184
■
Profile 187
■
Roles: an Orcas preview 191
Message board application 192
5.5 Summary 193
6
Partial-page rendering with UpdatePanels 194

6.1 With great power comes great responsibility 195
Evolution of the UpdatePanel 195
■
A simple example 196
6.2 Getting to know the UpdatePanel 201
Content for the UpdatePanel 201
■
Update modes 203
■
Render
modes 205
■
ASP.NET page lifecycle 207
6.3 Triggers 208
Asynchronous triggers 208
■
Postback triggers 210
Manual triggers 211
6.4 Advanced techniques 213
Repeating UpdatePanels 213
■
Nesting UpdatePanels 216
6.5 Live GridView filter 216
Live GridView filter goals 217
■
How does the GridView
filter work? 218
■
Adding Ajax to the GridView filter 223
It’s alive! 224

6.6 Summary 227
PART 2 ADVANCED TECHNIQUES 229
7
Under the hood of the UpdatePanel 231
7.1 The PageRequestManager: the unsung hero 232
The client-side event model 233
■
The anatomy of an
asynchronous postback 236
7.2 A client-side event viewer 243
Getting started 244
■
Handling client-side events 245
Aborting a postback 250
■
Managing postback priority 251
Notifying the user 252
■
Locked and loaded 253
■
Client-side
error handling 255
CONTENTS xiii
7.3 UpdatePanel cookbook 256
Why is the UpdatePanel slow? 256
■
Inject JavaScript during a
partial postback 258
■
Getting the validators to work 260

Sys.WebForms.PageRequestManagerParseErrorException 261
7.4 Caveats and limitations 262
Asynchronous requests are sequential 263
■
Unsupported
ASP.NET 2.0 controls 263
7.5 Summary 263
8
ASP.NET AJAX client components 264
8.1 The client component model 265
Visual and nonvisual components 267
■
Controls and
behaviors 268
■
Component lifecycle 268
■
Containers 269
8.2 Working with client components 270
Creating components 273
■
Accessing components 276
■
Events
and property change notification 276
8.3 Behaviors 279
Sys.UI.Behavior 280
■
Creating behaviors 281
■

Accessing
behaviors 281
■
Enhancing a text box element 282
8.4 Controls 287
Sys.UI.Control 287
■
Creating controls 288
■
Accessing
controls 289
■
Creating an element wrapper: text box 289
Creating a PhotoGallery control 292
8.5 Summary 298
9
Building Ajax-enabled controls 299
9.1 Script descriptors 300
Script descriptor hierarchy 300
■
Describing a behavior 302
Describing a control 304
■
Script references 306
9.2 Introduction to Ajax-enabled controls 306
How Ajax-enabled controls work 307
■
Extenders and
script controls 308
9.3 Extenders 311

The IExtenderControl interface 311
■
Extender registration 312
An extender for FormattingBehavior 313
■
Using an extender 316
xiv CONTENTS
9.4 Script controls 319
The IScriptControl interface 319
■
Script control
registration 320
■
Design strategies 322
■
Adding Ajax to the
ASP.NET Login control 322
■
Using a script control 328
9.5 Summary 330
10
Developing with the Ajax Control Toolkit 332
10.1 A world of extenders 333
The auto-complete extender 334
■
The ScriptPath property 340
The BehaviorID property 340
10.2 The Ajax Control Toolkit API 343
The Toolkit’s base classes 343
■

A metadata-driven API 345
Building Toolkit extenders: the TextChanged extender 347
Support for Visual Studio Designer 355
10.3 Animations 357
Toolkit animation framework 357
■
Animation basics 359
Using the AnimationExtender 360
■
The UpdatePanelAnimation
extender 364
■
JSON and animations: adding transitions to the
PhotoGallery control 365
10.4 Summary 369
PART 3 ASP.NET AJAX FUTURES 371
11
XML Script 373
11.1 XML Script basics 374
Hello XML Script! 375
■
Controls and XML Script 378
■
From
XML Script to JavaScript 382
■
Type descriptors 383
11.2 Actions 386
SetPropertyAction 387
■

PostBackAction 389
InvokeMethodAction 389
■
Custom actions 394
11.3 Bindings 398
A simple binding 398
■
Binding direction 400
■
Target and data
path 401
■
Bindings as components 402
■
Transformers 404
Playing with transformers 405
■
Custom transformers 408
11.4 Summary 409
CONTENTS xv
12
Dragging and dropping 410
12.1 The drag-and-drop engine 411
How the engine works 412
■
A simple scenario for
drag and drop 415
■
Creating a draggable item 416
The startDragDrop method 418

■
The IDragSource
interface 419
■
Creating a drop target 422
■
The
IDropTarget interface 423
■
Putting together
the pieces 426
12.2 A drag-and-drop shopping cart 427
Server-side design 429
■
Client-side design 431
■
The
ShoppingCart control 432
■
The BooksCatalog control 435
Piecing it together 438
12.3 Summary 440
PART 4 MASTERING ASP.NET AJAX 441
13
Implementing common Ajax patterns 443
13.1 Script versioning 444
Getting informative stack traces 445
■
XML
comments in JavaScript code 447

■
Validating
function parameters 449
■
Parameter validation
in production code 452
■
Compressing and crunching
script files 454
13.2 Helpers, help me help you! 455
Automating the declaration of properties 456
Automating the creation of events 458
13.3 Logical navigation and unique URLs 461
Logical navigation 462
■
Unique URLs 468
13.4 Declarative data binding 470
Setting up the Web Service 470
■
The ListView
control 473
13.5 Declarative widgets 476
The drag-drop list 477
■
Widgets and XML Script 479
13.6 Summary 484
xvi CONTENTS
appendix A Installing ASP.NET AJAX 487
appendix B Tools for debugging Ajax applications 499
resources 521

index 523

xvii
foreword
ASP.NET is used daily by millions of professional developers world-wide. It runs
some of the most successful websites and applications in the world, and every day
thousands of new developers begin learning
ASP.NET for the first time—supported
by an incredible developer community of books, blogs, user groups, forums, and
developer websites.
Our goal with
ASP.NET AJAX is to enable developers to easily build great ASP.NET
applications that fully leverage the power of the browser, and which deliver a
smoother and more interactive experience for end users.
ASP.NET AJAX works with
all modern browsers, and allows you to easily build great web applications that work
cross-platform on all operating systems.
ASP.NET AJAX 1.0 is available as a free, fully
supported download for
ASP.NET 2.0. It will be built into the standard .NET setup
package starting with the .NET Framework 3.5 release of ASP.NET.
There are several things that I think distinguish
ASP.NET AJAX. The first is the
productivity it delivers. ASP.NET AJAX can be used to very quickly add common
AJAX behavior and functionality to an application with very minimal code. If you
want smoother page updates and richer client-UI behaviors, there isn’t another
AJAX framework out there that makes it easier.
What is great about

ASP.NET AJAX is that it also scales to advanced scenarios. You
can use the
ASP.NET AJAX client-side JavaScript library to build clean, encapsulated
JavaScript that makes asynchronous network callbacks to the server to build
extremely rich
UI (for an example of this visit: ). This
ability to start simple, but then go deep, using a core
AJAX programming model
xviii FOREWORD
that is nicely integrated into ASP.NET, ends up being extremely powerful, and is one
that enables developers to build great next-generation web applications.

ASP.NET AJAX in Action provides an excellent guide to learning and mastering
all of the functionality that
ASP.NET AJAX provides, and in particular it does a
great job of explaining its more advanced features. Alessandro, David, and Rama
are
ASP.NET AJAX experts and share their experiences and insights throughout
the book. They will help teach you how to fully leverage
ASP.NET AJAX and build
robust web applications faster and better than ever before.
Enjoy!
SCOTT GUTHRIE
General Manager, Developer Division
Microsoft Corporation
xix
foreword
Why is Ajax important? What makes a set of technologies that were invented a
decade ago suddenly relevant? Don’t we have easier ways to write rich applica-
tions? And aren’t some of those already cross-platform? Wasn’t the deployment

problem solved long ago, making web applications less and less relevant?
Those are legitimate questions—yet all the planets seem to have aligned for
Ajax right now.
First, the browser wars are finally over and even Internet Explorer is firmly
steered toward standards compliance. This means that it has become possible, at
last, to write truly cross-browser applications with a little help from Ajax toolkits,
effectively ironing-out any last differences.
Second, JavaScript, long considered a toy language, has evolved (in its usage at
least). Most of the engineering techniques that are a given in other languages are
finally available for JavaScript, thanks in part to the flexibility of the language and
in part to advances in tooling and
IDEs.
Third,
HTML and CSS as semantic and layout description languages are still
one of the most relevant options. No other rendering technology associates such a
low price of entry with the same developer friendliness and flexibility.
Finally, the technology is not disruptive and this may be its most compelling
advantage. With Ajax, you can use what you already know about web technologies
and incrementally improve your applications.
xx FOREWORD
This is what ASP.NET AJAX is about: start with what you know and learn as you
go, improving your toolset along the way. Our intention was to make it as easy as
possible for you to start and then to take you as far as you’re ready to go.
Alessandro, David, and Rama are among the best specialists in those technolo-
gies and they’re going to take you on an exciting ride. You’ll learn from the pio-
neers in this field what you need to know to write solid JavaScript,
HTML, and CSS
and how to exploit ASP.NET AJAX to its full potential. The authors of this book
have more combined knowledge about and experience with Ajax than almost any-
one else in the industry—and they’re about to share that treasure with you.

BERTRAND LE ROY, PH.D.
Software Design Engineer, ASP.NET team
Microsoft Corporation
xxi
preface
Every book tells a story—even a book about web programming. This story begins
in the summer of 2005, at the Professional Developer Conference (
PDC) in Los
Angeles. It was there that Microsoft gave us our first preview of Atlas, the original
codename for
ASP.NET AJAX. Excited about its promise, we immediately jumped
at the opportunity to play around with the young and evolving framework. In the
beginning (and we still do this today), we flocked to the forums, blogs, and user
groups to learn, and in the process shape, the latest technology.
When Manning approached us about collaborating on this book, it seemed
like a natural progression, considering all the time we had invested in learning
about the framework. Our goal was to provide the reader with the tools for
becoming a well-rounded
ASP.NET AJAX developer. To us this meant becoming
proficient in JavaScript, authoring Ajax-enabled controls, and understanding how
to enrich
ASP.NET applications through a collection of best practices and patterns.
Along the way, we wanted to display our enthusiasm for what makes ASP.NET AJAX
unique by sharing the lessons we had learned from the .NET community, our
everyday jobs, and from Microsoft.
What makes
ASP.NET AJAX in Action special (perhaps even irreplaceable) is its
approach to explaining in detail how to use and understand the framework.
Beginning with simple examples, we slowly progress to more complex, real-world

scenarios that challenge the reader to master the technology and raise his or her
skill level.
xxii PREFACE
With the book now complete, our “story” has been told and we believe that
we’ve achieved our goal in delivering a unique and thorough guide to
ASP.NET
AJAX
. As you explore the book, it is our hope that you will become inspired to
build the rich and intuitive applications that users expect today.

xxiii
acknowledgments
We’d like to thank everyone at Manning, especially our publisher, Marjan Bace; our
acquisitions editor, Mike Stephens; and our development editor, Nermina Miller,
for their continuous support and help with many aspects of the manuscript. Thanks
also to the others at Manning who worked with us in different stages of the project:
review editor Karen Tegtmayer, webmaster Gabriel Dobrescu, and not least of all
project editor Mary Piergies. Special thanks to copy editor Tiffany Taylor, proof-
reader Elizabeth Martin, design editor Dottie Marsico, and typesetter Gordan Sali-
novic. We’d like to also acknowledge the invaluable feedback and dedication of our
technical editor Joe Stagner, whose support and encouragement greatly contrib-
uted to the success of the book.
A very special thank you to Scott Guthrie of Microsoft and Bertrand Le Roy of
Microsoft for writing the forewords to our book. Finally, we also thank the many
reviewers of the manuscript: Irena Kennedy, Walter Myers, Darren Neimke, Eric
Pascarello, Lucas Carlson, Radhakrishna M.V., Berndt Hamboeck, Kazi Manzur
Rashid, Mark Mrachek, Curt Christianson, Mohammad Azam, Al Harding, Omar
AL Zabir, Sonu Kapoor, Steve Marx, Dave Glover, and Abe Semaan.
A
LESSANDRO GALLO

This is my first book, and I’ve put my time, passion, and soul into writing it. Now
that it’s done, I can say that writing a book is tough. This would have been impos-
sible to accomplish without the help of the people who contributed to its concep-
tion and development.
xxiv ACKNOWLEDGMENTS
Working with David and Rama has been an amazing experience. It was an
absolute pleasure working with you guys! I’m also grateful to those who dedicated
their time and energy to read and comment on the manuscript: David Anson,
Ronald Buckton, Sonu Kapoor, Bertrand Le Roy, Steve Marx, and Joe Stagner.
A special thank-you to Luis Abreu for all the help and suggestions he provided
during the many hours spent discussing
ASP.NET AJAX, since the first CTP release
of “Atlas.” Muito obrigado Luis!
And I can never say thank you enough to Valentina for her patience, enthusi-
asm, and love.
D
AVID BARKOL
Writing this book has been a rewarding and challenging experience. Although it
took more time that one could possibly justify, working with Alessandro and Rama
has been an absolute pleasure. I’m truly proud of what we’ve produced together
as a team and the friendship we’ve created in the process.
I would like to thank everybody at Neudesic for their technical expertise and
support, especially Samir Patel, Jason Jung, Tim Marshall, Parsa Rohani, Anthony
Ferry, and Ashish Agarwal. An extended thank-you goes out to Mickey Williams,
Steve Saxon, and Phil Scott for influencing my career and providing me with
invaluable advice and encouragement.
Thanks to our reviewers, who provided us with much-needed feedback and
support that greatly influenced our book. I would like to particularly thank Irena
Kennedy, Walter Myers, and Joe Stagner from Microsoft for their magnanimous
contributions and assistance during the review process.

Most important, I would like to thank my wife Emily and two daughters
Miranda and Madeline, for inspiring me to do my best every day. The sacrifices
they made prove what a wonderful family I have and how lucky I am to have them.
R
AMA KRISHNA VAVILALA
It has been an extreme pleasure to work with Alessandro and David. I consider
myself very fortunate and blessed for all the support and understanding I received
from them. Special thanks to our editor Michael Stephens for believing in all of us
and in this project.
I would like to acknowledge the support my family has shown to me during the
writing of the book. Thank you, Radhika, for all the hard work and understand-
ing; and thanks, Shreya, for not troubling me too much while I was writing.
My friend Nishant Sivakumar, who had just been through the book-writing
ordeal, was generous enough to share tips and tricks with me. Thanks, Nish!
Last but not least, I also thank the people who participate in the online forums
www.asp.net and www.codeproject.com. I have learned a lot from them.