ScottGu's Blog : jQuery

April 14th Links: ASP.NET, ASP.NET MVC, ASP.NET Web API and Visual Studio

ScottGu — Sun, 15 Apr 2012 02:19:14 GMT

Here is the latest in my link-listing blog series:

ASP.NET

Easily overlooked features in VS 11 Express for Web: Good post by Scott Hanselman that highlights a bunch of easily overlooked improvements that are coming to VS 11 (and specifically the free express editions) for web development: unit testing, browser chooser/launcher, IIS Express, CSS Color Picker, Image Preview in Solution Explorer and more.

Get Started with ASP.NET 4.5 Web Forms: Good 5-part tutorial that walks-through building an application using ASP.NET Web Forms and highlights some of the nice improvements coming with ASP.NET 4.5.

What is New in Razor V2 and What Else is New in Razor V2: Great posts by Andrew Nurse, a dev on the ASP.NET team, about some of the new improvements coming with ASP.NET Razor v2.

ASP.NET MVC 4 AllowAnonymous Attribute: Nice post from David Hayden that talks about the new [AllowAnonymous] filter introduced with ASP.NET MVC 4.

Introduction to the ASP.NET Web API: Great tutorial by Stephen Walher that covers how to use the new ASP.NET Web API support built-into ASP.NET 4.5 and ASP.NET MVC 4.

Comprehensive List of ASP.NET Web API Tutorials and Articles: Tugberk Ugurlu links to a huge collection of articles, tutorials, and samples about the new ASP.NET Web API capability.

Async Mashups using ASP.NET Web API: Nice post by Henrik on how you can use the new async language support coming with .NET 4.5 to easily and efficiently make asynchronous network requests that do not block threads within ASP.NET.

ASP.NET and Front-End Web Development

Visual Studio 11 and Front End Web Development - JavaScript/HTML5/CSS3: Nice post by Scott Hanselman that highlights some of the great improvements coming with VS 11 (including the free express edition) for front-end web development.

HTML5 Drag/Drop and Async Multi-file Upload with ASP.NET Web API: Great post by Filip W. that demonstrates how to implement an async file drag/drop uploader using HTML5 and ASP.NET Web API.

Device Emulator Guide for Mobile Development with ASP.NET: Good post from Rachel Appel that covers how to use various device emulators with ASP.NET and VS to develop cross platform mobile sites.

Fixing these jQuery: A Guide to Debugging: Great presentation by Adam Sontag on debugging with JavaScript and jQuery. Some really good tips, tricks and gotchas that can save a lot of time.

ASP.NET and Open Source

Getting Started with ASP.NET Web Stack Source on CodePlex: Fantastic post by Henrik (an architect on the ASP.NET team) that provides step by step instructions on how to work with the ASP.NET source code we recently open sourced.

Contributing to ASP.NET Web Stack Source on CodePlex: Follow-on to the post above (also by Henrik) that walks-through how you can submit a code contribution to the ASP.NET MVC, Web API and Razor projects.

Overview of the WebApiContrib project: Nice post by Pedro Reys on the new open source WebApiContrib project that has been started to deliver cool extensions and libraries for use with ASP.NET Web API.

Entity Framework

Entity Framework 5 Performance Improvements and Performance Considerations for EF5: Good articles that describes some of the big performance wins coming with EF5 (which will ship with both .NET 4.5 and ASP.NET MVC 4). Automatic compilation of LINQ queries will yield some significant performance wins (up to 600% faster).

ASP.NET MVC 4 and EF Database Migrations: Good post by David Hayden that covers the new database migrations support within EF 4.3 which allows you to easily update your database schema during development - without losing any of the data within it.

Visual Studio

What's New in Visual Studio 11 Unit Testing: Nice post by Peter Provost (from the VS team) that talks about some of the great improvements coming to VS11 for unit testing - including built-in VS tooling support for a broad set of unit test frameworks (including NUnit, XUnit, Jasmine, QUnit and more)

Hope this helps,

Scott

36 Hour Free Offer: jQuery Fundamentals Training

ScottGu — Wed, 23 Feb 2011 18:19:46 GMT

Pluralsight (a great .NET training company) is offering the opportunity to watch their jQuery Fundamentals course for free for the next 36 hours.

The course is presented by the most excellent Dan Wahlin and contains 5 hours of great end to end content. Pluralsight will be offering this jQuery Fundamentals course for free until Thursday evening (9pm PST).

Pluralsight has about 100 other great training courses available similar to this one. They recently launched a new subscription plan that allows you to watch all of their courses online starting from $29 a month. They also offer a 10 day free trial option that you can use to try it out. You can learn more about it here.

Free jQuery 1.5 Visual Cheat Sheet

While on the topic of jQuery, I wanted to link to one other useful resource to download if you are using jQuery – which is a free jQuery PDF “cheat sheet” for the jQuery 1.5 APIs.

You can download it for free here.

Hope this helps,

Scott

P.S. I am also now using Twitter for quick updates and to share links. Follow me at: twitter.com/scottgu

Feb 2nd Links: Visual Studio, ASP.NET, ASP.NET MVC, JQuery, Windows Phone

ScottGu — Thu, 03 Feb 2011 07:15:11 GMT

Here is the latest in my link-listing series. Also check out my Best of 2010 Summary for links to 100+ other posts I’ve done in the last year.

[I am also now using Twitter for quick updates and to share links. Follow me at: twitter.com/scottgu]

Community News

MVCConf Conference Next Tuesday: Attend the free, online ASP.NET MVC Conference being organized by the community next Tuesday. Here is a list of some of the talks you can watch live.

Visual Studio

HTML5 and CSS3 in VS 2010 SP1: Good post from the Visual Studio web tools team that talks about the new support coming in VS 2010 SP1 for HTML5 and CSS3.

Database Deployment with the VS 2010 Package/Publish Database Tool: Rachel Appel has a nice post that covers how to enable database deployment using the built-in VS 2010 web deployment support. Also check out her ASP.NET web deployment post from last month.

VsVim Update Released: Jared posts about the latest update of his VsVim extension for Visual Studio 2010. This free extension enables VIM based key-bindings within VS.

ASP.NET

How to Add Mobile Pages to your ASP.NET Web Forms / MVC Apps: Great whitepaper by Steve Sanderson that covers how to mobile-enable your ASP.NET and ASP.NET MVC based applications.

New Entity Framework Tutorials for ASP.NET Developers: The ASP.NET and EF teams have put together a bunch of nice tutorials on using the Entity Framework data library with ASP.NET Web Forms.

Using ASP.NET Dynamic Data with EF Code First (via NuGet): Nice post from David Ebbo that talks about how to use the new EF Code First Library with ASP.NET Dynamic Data.

Common Performance Issues with ASP.NET Web Sites: Good post with lots of performance tuning suggestions (mostly deployment settings) for ASP.NET apps.

ASP.NET MVC

Razor View Converter: Free, automated tool from Telerik that can convert existing .aspx view templates to Razor view templates.

ASP.NET MVC 3 Internationalization: Nadeem has a great post that talks about a variety of techniques you can use to enable Globalization and Localization within your ASP.NET MVC 3 applications.

ASP.NET MVC 3 Tutorials by David Hayden: Great set of tutorials and posts by David Hayden on some of the new ASP.NET MVC 3 features.

EF Fixed Concurrency Mode and MVC: Chris Sells has a nice post that talks about how to handle concurrency with updates done with EF using ASP.NET MVC.

ASP.NET and jQuery

jQuery Performance Tips and Tricks: A free 30 minute video that covers some great tips and tricks to keep in mind when using jQuery.

jQuery 1.5’s AJAX rewrite and ASP.NET services - All is well: Nice post by Dave Ward that talks about using the new jQuery 1.5 to call ASP.NET ASMX Services. Good news according to Dave is that all is well :-)

jQuery UI Modal Dialogs for ASP.NET MVC: Nice post by Rob Regan that talks about a few approaches you can use to implement dialogs with jQuery UI and ASP.NET MVC.

Windows Phone 7

Free PDF eBook on Building Windows Phone 7 Applications with Silverlight: Free book that walksthrough how to use Silverlight and Visual Studio to build Windows Phone 7 applications.

Hope this helps,

Scott

Announcing release of ASP.NET MVC 3, IIS Express, SQL CE 4, Web Farm Framework, Orchard, WebMatrix

ScottGu — Thu, 13 Jan 2011 18:11:00 GMT

I’m excited to announce the release today of several products:

ASP.NET MVC 3
NuGet
IIS Express 7.5
SQL Server Compact Edition 4
Web Deploy and Web Farm Framework 2.0
Orchard 1.0
WebMatrix 1.0

The above products are all free. They build upon the .NET 4 and VS 2010 release, and add a ton of additional value to ASP.NET (both Web Forms and MVC) and the Microsoft Web Server stack.

ASP.NET MVC 3

Today we are shipping the final release of ASP.NET MVC 3. You can download and install ASP.NET MVC 3 here. The ASP.NET MVC 3 source code (released under an OSI-compliant open source license) can also optionally be downloaded here.

ASP.NET MVC 3 is a significant update that brings with it a bunch of great features. Some of the improvements include:

Razor

ASP.NET MVC 3 ships with a new view-engine option called “Razor” (in addition to continuing to support/enhance the existing .aspx view engine). Razor minimizes the number of characters and keystrokes required when writing a view template, and enables a fast, fluid coding workflow.

Unlike most template syntaxes, with Razor you do not need to interrupt your coding to explicitly denote the start and end of server blocks within your HTML. The Razor parser is smart enough to infer this from your code. This enables a compact and expressive syntax which is clean, fast and fun to type.

You can learn more about Razor from some of the blog posts I’ve done about it over the last 6 months

Today’s release supports full code intellisense support for Razor (both VB and C#) with Visual Studio 2010 and the free Visual Web Developer 2010 Express.

JavaScript Improvements

ASP.NET MVC 3 enables richer JavaScript scenarios and takes advantage of emerging HTML5 capabilities.

The AJAX and Validation helpers in ASP.NET MVC 3 now use an Unobtrusive JavaScript based approach. Unobtrusive JavaScript avoids injecting inline JavaScript into HTML, and enables cleaner separation of behavior using the new HTML 5 “data-“ attribute convention (which conveniently works on older browsers as well – including IE6). This keeps your HTML tight and clean, and makes it easier to optionally swap out or customize JS libraries.

ASP.NET MVC 3 now includes built-in support for posting JSON-based parameters from client-side JavaScript to action methods on the server. This makes it easier to exchange data across the client and server, and build rich JavaScript front-ends. We think this capability will be particularly useful going forward with scenarios involving client templates and data binding (including the jQuery plugins the ASP.NET team recently contributed to the jQuery project).

Previous releases of ASP.NET MVC included the core jQuery library. ASP.NET MVC 3 also now ships the jQuery Validate plugin (which our validation helpers use for client-side validation scenarios). We are also now shipping and including jQuery UI by default as well (which provides a rich set of client-side JavaScript UI widgets for you to use within projects).

Improved Validation

ASP.NET MVC 3 includes a bunch of validation enhancements that make it even easier to work with data.

Client-side validation is now enabled by default with ASP.NET MVC 3 (using an onbtrusive javascript implementation). Today’s release also includes built-in support for Remote Validation - which enables you to annotate a model class with a validation attribute that causes ASP.NET MVC to perform a remote validation call to a server method when validating input on the client.

The validation features introduced within .NET 4’s System.ComponentModel.DataAnnotations namespace are now supported by ASP.NET MVC 3. This includes support for the new IValidatableObject interface – which enables you to perform model-level validation, and allows you to provide validation error messages specific to the state of the overall model, or between two properties within the model.

ASP.NET MVC 3 also supports the improvements made to the ValidationAttribute class in .NET 4. ValidationAttribute now supports a new IsValid overload that provides more information about the current validation context, such as what object is being validated. This enables richer scenarios where you can validate the current value based on another property of the model. We’ve shipped a built-in [Compare] validation attribute with ASP.NET MVC 3 that uses this support and makes it easy out of the box to compare and validate two property values.

You can use any data access API or technology with ASP.NET MVC. This past year, though, we’ve worked closely with the .NET data team to ensure that the new EF Code First library works really well for ASP.NET MVC applications. These two posts of mine cover the latest EF Code First preview and demonstrates how to use it with ASP.NET MVC 3 to enable easy editing of data (with end to end client+server validation support). The final release of EF Code First will ship in the next few weeks.

Today we are also publishing the first preview of a new MvcScaffolding project. It enables you to easily scaffold ASP.NET MVC 3 Controllers and Views, and works great with EF Code-First (and is pluggable to support other data providers). You can learn more about it – and install it via NuGet today - from Steve Sanderson’s MvcScaffolding blog post.

Output Caching

Previous releases of ASP.NET MVC supported output caching content at a URL or action-method level.

With ASP.NET MVC V3 we are also enabling support for partial page output caching – which allows you to easily output cache regions or fragments of a response as opposed to the entire thing. This ends up being super useful in a lot of scenarios, and enables you to dramatically reduce the work your application does on the server.

The new partial page output caching support in ASP.NET MVC 3 enables you to easily re-use cached sub-regions/fragments of a page across multiple URLs on a site. It supports the ability to cache the content either on the web-server, or optionally cache it within a distributed cache server like Windows Server AppFabric or memcached.

I’ll post some tutorials on my blog that show how to take advantage of ASP.NET MVC 3’s new output caching support for partial page scenarios in the future.

Better Dependency Injection

ASP.NET MVC 3 provides better support for applying Dependency Injection (DI) and integrating with Dependency Injection/IOC containers.

With ASP.NET MVC 3 you no longer need to author custom ControllerFactory classes in order to enable DI with Controllers. You can instead just register a Dependency Injection framework with ASP.NET MVC 3 and it will resolve dependencies not only for Controllers, but also for Views, Action Filters, Model Binders, Value Providers, Validation Providers, and Model Metadata Providers that you use within your application.

This makes it much easier to cleanly integrate dependency injection within your projects.

Other Goodies

ASP.NET MVC 3 includes dozens of other nice improvements that help to both reduce the amount of code you write, and make the code you do write cleaner. Here are just a few examples:

Improved New Project dialog that makes it easy to start new ASP.NET MVC 3 projects from templates.
Improved Add->View Scaffolding support that enables the generation of even cleaner view templates.
New ViewBag property that uses .NET 4’s dynamic support to make it easy to pass late-bound data from Controllers to Views.
Global Filters support that allows specifying cross-cutting filter attributes (like [HandleError]) across all Controllers within an app.
New [AllowHtml] attribute that allows for more granular request validation when binding form posted data to models.
Sessionless controller support that allows fine grained control over whether SessionState is enabled on a Controller.
New ActionResult types like HttpNotFoundResult and RedirectPermanent for common HTTP scenarios.
New Html.Raw() helper to indicate that output should not be HTML encoded.
New Crypto helpers for salting and hashing passwords.
And much, much more…

Learn More about ASP.NET MVC 3

We will be posting lots of tutorials and samples on the http://asp.net/mvc site in the weeks ahead. Below are two good ASP.NET MVC 3 tutorials available on the site today:

We’ll post additional ASP.NET MVC 3 tutorials and videos on the http://asp.net/mvc site in the future. Visit it regularly to find new tutorials as they are published.

How to Upgrade Existing Projects

ASP.NET MVC 3 is compatible with ASP.NET MVC 2 – which means it should be easy to update existing MVC projects to ASP.NET MVC 3.

The new features in ASP.NET MVC 3 build on top of the foundational work we’ve already done with the MVC 1 and MVC 2 releases – which means that the skills, knowledge, libraries, and books you’ve acquired are all directly applicable with the MVC 3 release. MVC 3 adds new features and capabilities – it doesn’t obsolete existing ones.

You can upgrade existing ASP.NET MVC 2 projects by following the manual upgrade steps in the release notes. Alternatively, you can use this automated ASP.NET MVC 3 upgrade tool to easily update your existing projects.

Localized Builds

Today’s ASP.NET MVC 3 release is available in English. We will be releasing localized versions of ASP.NET MVC 3 (in 9 languages) in a few days. I’ll blog pointers to the localized downloads once they are available.

NuGet

Today we are also shipping NuGet – a free, open source, package manager that makes it easy for you to find, install, and use open source libraries in your projects. It works with all .NET project types (including ASP.NET Web Forms, ASP.NET MVC, WPF, WinForms, Silverlight, and Class Libraries). You can download and install it here.

NuGet enables developers who maintain open source projects (for example, .NET projects like Moq, NHibernate, Ninject, StructureMap, NUnit, Windsor, Raven, Elmah, etc) to package up their libraries and register them with an online gallery/catalog that is searchable. The client-side NuGet tools – which include full Visual Studio integration – make it trivial for any .NET developer who wants to use one of these libraries to easily find and install it within the project they are working on.

NuGet handles dependency management between libraries (for example: library1 depends on library2). It also makes it easy to update (and optionally remove) libraries from your projects later. It supports updating web.config files (if a package needs configuration settings). It also allows packages to add PowerShell scripts to a project (for example: scaffold commands). Importantly, NuGet is transparent and clean – and does not install anything at the system level. Instead it is focused on making it easy to manage libraries you use with your projects.

Our goal with NuGet is to make it as simple as possible to integrate open source libraries within .NET projects.

NuGet Gallery

This week we also launched a beta version of the http://nuget.org web-site – which allows anyone to easily search and browse an online gallery of open source packages available via NuGet. The site also now allows developers to optionally submit new packages that they wish to share with others. You can learn more about how to create and share a package here.

There are hundreds of open-source .NET projects already within the NuGet Gallery today. We hope to have thousands there in the future.

IIS Express 7.5

Today we are also shipping IIS Express 7.5. IIS Express is a free version of IIS 7.5 that is optimized for developer scenarios. It works for both ASP.NET Web Forms and ASP.NET MVC project types.

We think IIS Express combines the ease of use of the ASP.NET Web Server (aka Cassini) currently built-into Visual Studio today with the full power of IIS. Specifically:

It’s lightweight and easy to install (less than 5Mb download and a quick install)
It does not require an administrator account to run/debug applications from Visual Studio
It enables a full web-server feature set – including SSL, URL Rewrite, and other IIS 7.x modules
It supports and enables the same extensibility model and web.config file settings that IIS 7.x support
It can be installed side-by-side with the full IIS web server as well as the ASP.NET Development Server (they do not conflict at all)
It works on Windows XP and higher operating systems – giving you a full IIS 7.x developer feature-set on all Windows OS platforms

IIS Express (like the ASP.NET Development Server) can be quickly launched to run a site from a directory on disk. It does not require any registration/configuration steps. This makes it really easy to launch and run for development scenarios. You can also optionally redistribute IIS Express with your own applications if you want a lightweight web-server. The standard IIS Express EULA now includes redistributable rights.

Visual Studio 2010 SP1 adds support for IIS Express. Read my VS 2010 SP1 and IIS Express blog post to learn more about what it enables.

SQL Server Compact Edition 4

Today we are also shipping SQL Server Compact Edition 4 (aka SQL CE 4). SQL CE is a free, embedded, database engine that enables easy database storage.

No Database Installation Required

SQL CE does not require you to run a setup or install a database server in order to use it. You can simply copy the SQL CE binaries into the \bin directory of your ASP.NET application, and then your web application can use it as a database engine. No setup or extra security permissions are required for it to run. You do not need to have an administrator account on the machine. Just copy your web application onto any server and it will work. This is true even of medium-trust applications running in a web hosting environment.

SQL CE runs in-memory within your ASP.NET application and will start-up when you first access a SQL CE database, and will automatically shutdown when your application is unloaded. SQL CE databases are stored as files that live within the \App_Data folder of your ASP.NET Applications.

Works with Existing Data APIs

SQL CE 4 works with existing .NET-based data APIs, and supports a SQL Server compatible query syntax. This means you can use existing data APIs like ADO.NET, as well as use higher-level ORMs like Entity Framework and NHibernate with SQL CE. This enables you to use the same data programming skills and data APIs you know today.

Supports Development, Testing and Production Scenarios

SQL CE can be used for development scenarios, testing scenarios, and light production usage scenarios. With the SQL CE 4 release we’ve done the engineering work to ensure that SQL CE won’t crash or deadlock when used in a multi-threaded server scenario (like ASP.NET). This is a big change from previous releases of SQL CE – which were designed for client-only scenarios and which explicitly blocked running in web-server environments. Starting with SQL CE 4 you can use it in a web-server as well.

There are no license restrictions with SQL CE. It is also totally free.

Tooling Support with VS 2010 SP1

Visual Studio 2010 SP1 adds support for SQL CE 4 and ASP.NET Projects. Read my VS 2010 SP1 and SQL CE 4 blog post to learn more about what it enables.

Web Deploy and Web Farm Framework 2.0

Today we are also releasing Microsoft Web Deploy V2 and Microsoft Web Farm Framework V2. These services provide a flexible and powerful way to deploy ASP.NET applications onto either a single server, or across a web farm of machines.

You can learn more about these capabilities from my previous blog posts on them:

Visit the http://iis.net website to learn more and install them. Both are free.

Orchard 1.0

Today we are also releasing Orchard v1.0.

Orchard is a free, open source, community based project. It provides Content Management System (CMS) and Blogging System support out of the box, and makes it possible to easily create and manage web-sites without having to write code (site owners can customize a site through the browser-based editing tools built-into Orchard). Read these tutorials to learn more about how you can setup and manage your own Orchard site.

Orchard itself is built as an ASP.NET MVC 3 application using Razor view templates (and by default uses SQL CE 4 for data storage). Developers wishing to extend an Orchard site with custom functionality can open and edit it as a Visual Studio project – and add new ASP.NET MVC Controllers/Views to it.

WebMatrix 1.0

WebMatrix is a new, free, web development tool from Microsoft that provides a suite of technologies that make it easier to enable website development. It enables a developer to start a new site by browsing and downloading an app template from an online gallery of web applications (which includes popular apps like Umbraco, DotNetNuke, Orchard, WordPress, Drupal and Joomla). Alternatively it also enables developers to create and code web sites from scratch.

WebMatrix is task focused and helps guide developers as they work on sites. WebMatrix includes IIS Express, SQL CE 4, and ASP.NET - providing an integrated web-server, database and programming framework combination. It also includes built-in web publishing support which makes it easy to find and deploy sites to web hosting providers.

You can learn more about WebMatrix from my Introducing WebMatrix blog post this summer. Visit http://microsoft.com/web to download and install it today.

Summary

I’m really excited about today’s releases – they provide a bunch of additional value that makes web development with ASP.NET, Visual Studio and the Microsoft Web Server a lot better.

A lot of folks worked hard to share this with you today. On behalf of my whole team – we hope you enjoy them!

Scott

P.S. In addition to blogging, I am also now using Twitter for quick updates and to share links. Follow me at: twitter.com/scottgu

Dec 5th Links: ASP.NET, ASP.NET MVC, jQuery, Silverlight, Visual Studio

ScottGu — Mon, 06 Dec 2010 00:31:49 GMT

Here is the latest in my link-listing series. Also check out my VS 2010 and .NET 4 series for another on-going blog series I’m working on.

[In addition to blogging, I am also now using Twitter for quick updates and to share links. Follow me at: twitter.com/scottgu]

ASP.NET

ASP.NET Code Samples Collection: J.D. Meier has a great post that provides a detailed round-up of ASP.NET code samples and tutorials from a wide variety of sources. Lots of useful pointers.

Slash your ASP.NET compile/load time without any hard work: Nice article that details a bunch of optimizations you can make to speed up ASP.NET project load and compile times. You might also want to read my previous blog post on this topic here.

10 Essential Tools for Building ASP.NET Websites: Great article by Stephen Walther on 10 great (and free) tools that enable you to more easily build great ASP.NET Websites. Highly recommended reading.

Optimize Images using the ASP.NET Sprite and Image Optimization Framework: A nice article by 4GuysFromRolla that discusses how to use the open-source ASP.NET Sprite and Image Optimization Framework (one of the tools recommended by Stephen in the previous article). You can use this to significantly improve the load-time of your pages on the client.

Formatting Dates, Times and Numbers in ASP.NET: Scott Mitchell has a great article that discusses formatting dates, times and numbers in ASP.NET. A very useful link to bookmark. Also check out James Michael’s DateTime is Packed with Goodies blog post for other DateTime tips.

Examining ASP.NET’s Membership, Roles and Profile APIs (Part 18): Everything you could possibly want to known about ASP.NET’s built-in Membership, Roles and Profile APIs must surely be in this tutorial series. Part 18 covers how to store additional user info with Membership.

ASP.NET with jQuery

An Introduction to jQuery Templates: Stephen Walther has written an outstanding introduction and tutorial on the new jQuery Template plugin that the ASP.NET team has contributed to the jQuery project.

Composition with jQuery Templates and jQuery Templates, Composite Rendering, and Remote Loading: Dave Ward has written two nice posts that talk about composition scenarios with jQuery Templates and some cool scenarios you can enable with them.

Using jQuery and ASP.NET to Build a News Ticker: Scott Mitchell has a nice tutorial that demonstrates how to build a dynamically updated “news ticker” style UI with ASP.NET and jQuery.

Checking All Checkboxes in a GridView using jQuery: Scott Mitchell has a nice post that covers how to use jQuery to enable a checkbox within a GridView’s header to automatically check/uncheck all checkboxes contained within rows of it.

Using jQuery to POST Form Data to an ASP.NET AJAX Web Service: Rick Strahl has a nice post that discusses how to capture form variables and post them to an ASP.NET AJAX Web Service (.asmx).

ASP.NET MVC

ASP.NET MVC Diagnostics Using NuGet: Phil Haack has a nice post that demonstrates how to easily install a diagnostics page (using NuGet) that can help identify and diagnose common configuration issues within your apps.

ASP.NET MVC 3 JsonValueProviderFactory: James Hughes has a nice post that discusses how to take advantage of the new JsonValueProviderFactory support built into ASP.NET MVC 3. This makes it easy to post JSON payloads to MVC action methods.

Practical jQuery Mobile with ASP.NET MVC: James Hughes has another nice post that discusses how to use the new jQuery Mobile library with ASP.NET MVC to build great mobile web applications.

Credit Card Validator for ASP.NET MVC 3: Benjii Me has a nice post that demonstrates how to build a [CreditCard] validator attribute that can be used to easily validate credit card numbers are in the correct format with ASP.NET MVC.

Silverlight

Silverlight FireStarter Keynote and Sessions: A great blog post from John Papa that contains pointers and descriptions of all the great Silverlight content we published last week at the Silverlight FireStarter. You can watch all of the talks online. More details on my keynote and Silverlight 5 announcements can be found here.

31 Days of Windows Phone 7: 31 great tutorials on how to build Windows Phone 7 applications (using Silverlight).

Silverlight for Windows Phone Toolkit Update: David Anson has a nice post that discusses some of the additional controls provided with the Silverlight for Windows Phone Toolkit.

Visual Studio

JavaScript Editor Extensions: A nice (and free) Visual Studio plugin built by the web tools team that significantly improves the JavaScript intellisense support within Visual Studio.

HTML5 Intellisense for Visual Studio: Gil has a blog post that discusses a new extension my team has posted to the Visual Studio Extension Gallery that adds HTML5 schema support to Visual Studio 2008 and 2010.

Team Build + Web Deployment + Web Deploy + VS 2010 = Goodness: Visual blogs about how to enable a continuous deployment system with VS 2010, TFS 2010 and the Microsoft Web Deploy framework.

Visual Studio 2010 Emacs Emulation Extension and VIM Emulation Extension: Check out these two extensions if you are fond of Emacs and VIM key bindings and want to enable them within Visual Studio 2010.

Hope this helps,

Scott

jQuery Templates, Data Link, and Globalization Accepted as Official jQuery Plugins

ScottGu — Mon, 04 Oct 2010 14:46:36 GMT

The jQuery library has a passionate community of developers, and it is now the most widely used JavaScript library on the web today.

Two years ago I announced that Microsoft would begin offering product support for jQuery, and that we’d be including it in new versions of Visual Studio going forward. By default, when you create new ASP.NET Web Forms and ASP.NET MVC projects with VS 2010, the core jQuery library is now automatically added to your project.

Earlier this year at the MIX 2010 conference I announced that Microsoft would also begin contributing code to the jQuery project. During one of my keynotes, John Resig -- the creator of the jQuery library – joined me on stage and talked a little about our participation and discussed an early prototype of a new client templating API for jQuery.

I later blogged more details about the jQuery Templates plugin, jQuery Data Link plugin, and jQuery Globalization plugin that the ASP.NET team has been working on in conjunction with the jQuery team and jQuery community. We’ve had a lot of requests from ASP.NET customers looking to enable this type of functionality. We followed the standard jQuery open source model and posted prototypes of the plugins to Github.com, participated in the jQuery forums, and incorporated design feedback from the community.

Official jQuery Plugins

Today, I am happy to make a joint announcement with the jQuery team that the jQuery project has accepted these three plugins (jQuery Templates, jQuery Data Link, and jQuery Globalization) as official jQuery plugins.

As official jQuery plugins, the plugins will be maintained as part of the jQuery project. Starting today, you can download these plugins by visiting the jQuery website. The documentation for these plugins is also now integrated within the official jQuery documentation site.

Furthermore, in the next major release of jQuery (jQuery 1.5), the jQuery Templates plugin will be included as a standard part of the core jQuery library. This means that the “jQuery Templates” functionality will be included in the jQuery.js file. And it means that developers will be able to take advantage of a standard templating library and syntax when working with jQuery.

Learning More

You can learn more about the plugins by watching the following Web Camps TV episode hosted by James Senior with Stephen Walther:

Web Camps TV #5 - Microsoft Commits Code to jQuery!

Below is additional information (and links to the official documentation on jQuery.com) for the three plugins:

jQuery Templates

The jQuery Templates plugin enables you to create client templates. For example, you can use the jQuery Templates plugin to format a set of database records that you have retrieved from the server through an Ajax request.

You can learn more about jQuery templates by reading my earlier blog entry on jQuery Templates and Data-Linking or by reading the documentation about it on the official jQuery website. In addition, Rey Bango, Boris Moore and James Senior have written some good blog posts on the jQuery Templates plugin:

When the next major version of jQuery is released -- jQuery 1.5 -- jQuery Templates will be included as a standard part of the jQuery library.

jQuery Data Link

The jQuery Data Link plugin enables you to easily keep your user interface and data synchronized. For example, you can use the Data Link plugin to automatically synchronize the input fields of an HTML product form with the properties of a JavaScript product object.

You can learn more about the Data Link plugin by reading my previous blog entry on jQuery Templates and Data-Linking. The documentation for the Data Link plugin is also now live at the official jQuery website.

jQuery Globalization

The jQuery Globalization plugin enables you to use different cultural conventions when formatting or parsing numbers, dates and times, calendars, and currencies. The Globalization plugin has information on over 350 cultures. You can use this plugin with the core jQuery library or plugins built on top of the jQuery library.

You can learn more about the jQuery Globalization plugin by reading my previous blog entry on the jQuery Globalization plugin.

Summary

My team is excited to participate and contribute to the jQuery project. We hope these three plugins make it easier for all web developers to build great sites and applications. We’ve made good progress the last few months, and are looking forward to making new announcements concerning jQuery in the future.

You can learn even more about today’s announcement from the jQuery team’s blog post about it.

Hope this helps,

Scott

P.S. In addition to blogging, I am also now using Twitter for quick updates and to share links. Follow me at: twitter.com/scottgu

jQuery Globalization Plugin from Microsoft

ScottGu — Fri, 11 Jun 2010 05:34:24 GMT

Last month I blogged about how Microsoft is starting to make code contributions to jQuery, and about some of the first code contributions we were working on: jQuery Templates and Data Linking support.

Today, we released a prototype of a new jQuery Globalization Plugin that enables you to add globalization support to your JavaScript applications. This plugin includes globalization information for over 350 cultures ranging from Scottish Gaelic, Frisian, Hungarian, Japanese, to Canadian English. We will be releasing this plugin to the community as open-source.

You can download our prototype for the jQuery Globalization plugin from our Github repository:

http://github.com/nje/jquery-glob

You can also download a set of samples that demonstrate some simple use-cases with it here.

Understanding Globalization

The jQuery Globalization plugin enables you to easily parse and format numbers, currencies, and dates for different cultures in JavaScript. For example, you can use the Globalization plugin to display the proper currency symbol for a culture:

You also can use the Globalization plugin to format dates so that the day and month appear in the right order and the day and month names are correctly translated:

Notice above how the Arabic year is displayed as 1431. This is because the year has been converted to use the Arabic calendar.

Some cultural differences, such as different currency or different month names, are obvious. Other cultural differences are surprising and subtle. For example, in some cultures, the grouping of numbers is done unevenly. In the "te-IN" culture (Telugu in India), groups have 3 digits and then 2 digits. The number 1000000 (one million) is written as "10,00,000". Some cultures do not group numbers at all. All of these subtle cultural differences are handled by the jQuery Globalization plugin automatically.

Getting dates right can be especially tricky. Different cultures have different calendars such as the Gregorian and UmAlQura calendars. A single culture can even have multiple calendars. For example, the Japanese culture uses both the Gregorian calendar and a Japanese calendar that has eras named after Japanese emperors. The Globalization Plugin includes methods for converting dates between all of these different calendars.

Using Language Tags

The jQuery Globalization plugin uses the language tags defined in the RFC 4646 and RFC 5646 standards to identity cultures (see http://tools.ietf.org/html/rfc5646). A language tag is composed out of one or more subtags separated by hyphens. For example:

Language Tag	Language Name (in English)
en-AU	English (Australia)
en-BZ	English (Belize)
en-CA	English (Canada)
Id	Indonesian
zh-CHS	Chinese (Simplified) Legacy
Zu	isiZulu

Notice that a single language, such as English, can have several language tags. Speakers of English in Canada format numbers, currencies, and dates using different conventions than speakers of English in Australia or the United States. You can find the language tag for a particular culture by using the Language Subtag Lookup tool located here: http://rishida.net/utils/subtags/

The jQuery Globalization plugin download includes a folder named globinfo that contains the information for each of the 350 cultures. Actually, this folder contains more than 700 files because the folder includes both minified and un-minified versions of each file.

For example, the globinfo folder includes JavaScript files named jQuery.glob.en-AU.js for English Australia, jQuery.glob.id.js for Indonesia, and jQuery.glob.zh-CHS for Chinese (Simplified) Legacy.

Example: Setting a Particular Culture

Imagine that you have been asked to create a German website and want to format all of the dates, currencies, and numbers using German formatting conventions correctly in JavaScript on the client. The HTML for the page might look like this:

Notice the span tags above. They mark the areas of the page that we want to format with the Globalization plugin. We want to format the product price, the date the product is available, and the units of the product in stock.

To use the jQuery Globalization plugin, we’ll add three JavaScript files to the page: the jQuery library, the jQuery Globalization plugin, and the culture information for a particular language:

In this case, I’ve statically added the jQuery.glob.de-DE.js JavaScript file that contains the culture information for German. The language tag “de-DE” is used for German as spoken in Germany.

Now that I have all of the necessary scripts, I can use the Globalization plugin to format the product price, date available, and units in stock values using the following client-side JavaScript:

The jQuery Globalization plugin extends the jQuery library with new methods - including new methods named preferCulture() and format(). The preferCulture() method enables you to set the default culture used by the jQuery Globalization plugin methods. Notice that the preferCulture() method accepts a language tag. The method will find the closest culture that matches the language tag.

The $.format() method is used to actually format the currencies, dates, and numbers. The second parameter passed to the $.format() method is a format specifier. For example, passing “c” causes the value to be formatted as a currency. The ReadMe file at github details the meaning of all of the various format specifiers: http://github.com/nje/jquery-glob

When we open the page in a browser, everything is formatted correctly according to German language conventions. A euro symbol is used for the currency symbol. The date is formatted using German day and month names. Finally, a period instead of a comma is used a number separator:

You can see a running example of the above approach with the 3_GermanSite.htm file in this samples download.

Example: Enabling a User to Dynamically Select a Culture

In the previous example we explicitly said that we wanted to globalize in German (by referencing the jQuery.glob.de-DE.js file). Let’s now look at the first of a few examples that demonstrate how to dynamically set the globalization culture to use.

Imagine that you want to display a dropdown list of all of the 350 cultures in a page. When someone selects a culture from the dropdown list, you want all of the dates in the page to be formatted using the selected culture.

Here’s the HTML for the page:

Notice that all of the dates are contained in a <span> tag with a data-date attribute (data-* attributes are a new feature of HTML 5 that conveniently also still work with older browsers). We’ll format the date represented by the data-date attribute when a user selects a culture from the dropdown list.

In order to display dates for any possible culture, we’ll include the jQuery.glob.all.js file like this:

The jQuery Globalization plugin includes a JavaScript file named jQuery.glob.all.js. This file contains globalization information for all of the more than 350 cultures supported by the Globalization plugin. At 367KB minified, this file is not small. Because of the size of this file, unless you really need to use all of these cultures at the same time, we recommend that you add the individual JavaScript files for particular cultures that you intend to support instead of the combined jQuery.glob.all.js to a page. In the next sample I’ll show how to dynamically load just the language files you need.

Next, we’ll populate the dropdown list with all of the available cultures. We can use the $.cultures property to get all of the loaded cultures:

Finally, we’ll write jQuery code that grabs every span element with a data-date attribute and format the date:

The jQuery Globalization plugin’s parseDate() method is used to convert a string representation of a date into a JavaScript date. The plugin’s format() method is used to format the date. The “D” format specifier causes the date to be formatted using the long date format.

And now the content will be globalized correctly regardless of which of the 350 languages a user visiting the page selects. You can see a running example of the above approach with the 4_SelectCulture.htm file in this samples download.

Example: Loading Globalization Files Dynamically

As mentioned in the previous section, you should avoid adding the jQuery.glob.all.js file to a page whenever possible because the file is so large. A better alternative is to load the globalization information that you need dynamically.

For example, imagine that you have created a dropdown list that displays a list of languages:

The following jQuery code executes whenever a user selects a new language from the dropdown list. The code checks whether the globalization file associated with the selected language has already been loaded. If the globalization file has not been loaded then the globalization file is loaded dynamically by taking advantage of the jQuery $.getScript() method.

The globalizePage() method is called after the requested globalization file has been loaded, and contains the client-side code to perform the globalization.

The advantage of this approach is that it enables you to avoid loading the entire jQuery.glob.all.js file. Instead you only need to load the files that you need and you don’t need to load the files more than once.

The 5_Dynamic.htm file in this samples download demonstrates how to implement this approach.

Example: Setting the User Preferred Language Automatically

Many websites detect a user’s preferred language from their browser settings and automatically use it when globalizing content. A user can set a preferred language for their browser. Then, whenever the user requests a page, this language preference is included in the request in the Accept-Language header.

When using Microsoft Internet Explorer, you can set your preferred language by following these steps:

Select the menu option Tools, Internet Options.
Select the General tab.
Click the Languages button in the Appearance section.
Click the Add button to add a new language to the list of languages.
Move your preferred language to the top of the list.

Notice that you can list multiple languages in the Language Preference dialog. All of these languages are sent in the order that you listed them in the Accept-Language header:

Accept-Language: fr-FR,id-ID;q=0.7,en-US;q=0.3

Strangely, you cannot retrieve the value of the Accept-Language header from client JavaScript. Microsoft Internet Explorer and Mozilla Firefox support a bevy of language related properties exposed by the window.navigator object, such as windows.navigator.browserLanguage and window.navigator.language, but these properties represent either the language set for the operating system or the language edition of the browser. These properties don’t enable you to retrieve the language that the user set as his or her preferred language.

The only reliable way to get a user’s preferred language (the value of the Accept-Language header) is to write server code. For example, the following ASP.NET page takes advantage of the server Request.UserLanguages property to assign the user’s preferred language to a client JavaScript variable named acceptLanguage (which then allows you to access the value using client-side JavaScript):

In order for this code to work, the culture information associated with the value of acceptLanguage must be included in the page. For example, if someone’s preferred culture is fr-FR (French in France) then you need to include either the jQuery.glob.fr-FR.js or the jQuery.glob.all.js JavaScript file in the page or the culture information won’t be available. The “6_AcceptLanguages.aspx” sample in this samples download demonstrates how to implement this approach.

If the culture information for the user’s preferred language is not included in the page then the $.preferCulture() method will fall back to using the neutral culture (for example, using jQuery.glob.fr.js instead of jQuery.glob.fr-FR.js). If the neutral culture information is not available then the $.preferCulture() method falls back to the default culture (English).

Example: Using the Globalization Plugin with the jQuery UI DatePicker

One of the goals of the Globalization plugin is to make it easier to build jQuery widgets that can be used with different cultures.

We wanted to make sure that the jQuery Globalization plugin could work with existing jQuery UI plugins such as the DatePicker plugin. To that end, we created a patched version of the DatePicker plugin that can take advantage of the Globalization plugin when rendering a calendar. The following image illustrates what happens when you add the jQuery Globalization and the patched jQuery UI DatePicker plugin to a page and select Indonesian as the preferred culture:

Notice that the headers for the days of the week are displayed using Indonesian day name abbreviations. Furthermore, the month names are displayed in Indonesian.

You can download the patched version of the jQuery UI DatePicker from our github website. Or you can use the version included in this samples download and used by the 7_DatePicker.htm sample file.

Summary

I’m excited about our continuing participation in the jQuery community. This Globalization plugin is the third jQuery plugin that we’ve released.

We’ve really appreciated all of the great feedback and design suggestions on the jQuery templating and data-linking prototypes that we released earlier this year. We also want to thank the jQuery and jQuery UI teams for working with us to create these plugins.

Hope this helps,

Scott

P.S. In addition to blogging, I am also now using Twitter for quick updates and to share links. You can follow me at: twitter.com/scottgu

jQuery Templates and Data Linking (and Microsoft contributing to jQuery)

ScottGu — Fri, 07 May 2010 07:26:36 GMT

The jQuery library has a passionate community of developers, and it is now the most widely used JavaScript library on the web today.

Two years ago I announced that Microsoft would begin offering product support for jQuery, and that we’d be including it in new versions of Visual Studio going forward. By default, when you create new ASP.NET Web Forms and ASP.NET MVC projects with VS 2010 you’ll find jQuery automatically added to your project.

A few weeks ago during my second keynote at the MIX 2010 conference I announced that Microsoft would also begin contributing to the jQuery project. During the talk, John Resig -- the creator of the jQuery library and leader of the jQuery developer team – talked a little about our participation and discussed an early prototype of a new client templating API for jQuery.

In this blog post, I’m going to talk a little about how my team is starting to contribute to the jQuery project, and discuss some of the specific features that we are working on such as client-side templating and data linking (data-binding).

Contributing to jQuery

jQuery has a fantastic developer community, and a very open way to propose suggestions and make contributions. Microsoft is following the same process to contribute to jQuery as any other member of the community.

As an example, when working with the jQuery community to improve support for templating to jQuery my team followed the following steps:

We created a proposal for templating and posted the proposal to the jQuery developer forum (http://forum.jquery.com/topic/jquery-templates-proposal and http://forum.jquery.com/topic/templating-syntax ).
After receiving feedback on the forums, the jQuery team created a prototype for templating and posted the prototype at the Github code repository (http://github.com/jquery/jquery-tmpl ).
We iterated on the prototype, creating a new fork on Github of the templating prototype, to suggest design improvements. Several other members of the community also provided design feedback by forking the templating code.

There has been an amazing amount of participation by the jQuery community in response to the original templating proposal (over 100 posts in the jQuery forum), and the design of the templating proposal has evolved significantly based on community feedback.

The jQuery team is the ultimate determiner on what happens with the templating proposal – they might include it in jQuery core, or make it an official plugin, or reject it entirely. My team is excited to be able to participate in the open source process, and make suggestions and contributions the same way as any other member of the community.

jQuery Template Support

Client-side templates enable jQuery developers to easily generate and render HTML UI on the client. Templates support a simple syntax that enables either developers or designers to declaratively specify the HTML they want to generate. Developers can then programmatically invoke the templates on the client, and pass JavaScript objects to them to make the content rendered completely data driven. These JavaScript objects can optionally be based on data retrieved from a server.

Because the jQuery templating proposal is still evolving in response to community feedback, the final version might look very different than the version below. This blog post gives you a sense of how you can try out and use templating as it exists today (you can download the prototype by the jQuery core team at http://github.com/jquery/jquery-tmpl or the latest submission from my team at http://github.com/nje/jquery-tmpl).

jQuery Client Templates

You create client-side jQuery templates by embedding content within a <script type="text/html"> tag. For example, the HTML below contains a <div> template container, as well as a client-side jQuery “contactTemplate” template (within the <script type="text/html"> element) that can be used to dynamically display a list of contacts:

The {{= name }} and {{= phone }} expressions are used within the contact template above to display the names and phone numbers of “contact” objects passed to the template.

We can use the template to display either an array of JavaScript objects or a single object. The JavaScript code below demonstrates how you can render a JavaScript array of “contact” object using the above template. The render() method renders the data into a string and appends the string to the “contactContainer” DIV element:

When the page is loaded, the list of contacts is rendered by the template. All of this template rendering is happening on the client-side within the browser:

Templating Commands and Conditional Display Logic

The current templating proposal supports a small set of template commands - including if, else, and each statements. The number of template commands was deliberately kept small to encourage people to place more complicated logic outside of their templates.

Even this small set of template commands is very useful though. Imagine, for example, that each contact can have zero or more phone numbers. The contacts could be represented by the JavaScript array below:

The template below demonstrates how you can use the if and each template commands to conditionally display and loop the phone numbers for each contact:

If a contact has one or more phone numbers then each of the phone numbers is displayed by iterating through the phone numbers with the each template command:

The jQuery team designed the template commands so that they are extensible. If you have a need for a new template command then you can easily add new template commands to the default set of commands.

Support for Client Data-Linking

The ASP.NET team recently submitted another proposal and prototype to the jQuery forums (http://forum.jquery.com/topic/proposal-for-adding-data-linking-to-jquery). This proposal describes a new feature named data linking. Data Linking enables you to link a property of one object to a property of another object - so that when one property changes the other property changes. Data linking enables you to easily keep your UI and data objects synchronized within a page.

If you are familiar with the concept of data-binding then you will be familiar with data linking (in the proposal, we call the feature data linking because jQuery already includes a bind() method that has nothing to do with data-binding).

Imagine, for example, that you have a page with the following HTML <input> elements:

The following JavaScript code links the two INPUT elements above to the properties of a JavaScript “contact” object that has a “name” and “phone” property:

When you execute this code, the value of the first INPUT element (#name) is set to the value of the contact name property, and the value of the second INPUT element (#phone) is set to the value of the contact phone property. The properties of the contact object and the properties of the INPUT elements are also linked – so that changes to one are also reflected in the other.

Because the contact object is linked to the INPUT element, when you request the page, the values of the contact properties are displayed:

More interesting, the values of the linked INPUT elements will change automatically whenever you update the properties of the contact object they are linked to.

For example, we could programmatically modify the properties of the “contact” object using the jQuery attr() method like below:

Because our two INPUT elements are linked to the “contact” object, the INPUT element values will be updated automatically (without us having to write any code to modify the UI elements):

Note that we updated the contact object above using the jQuery attr() method. In order for data linking to work, you must use jQuery methods to modify the property values.

Two Way Linking

The linkBoth() method enables two-way data linking. The contact object and INPUT elements are linked in both directions. When you modify the value of the INPUT element, the contact object is also updated automatically.

For example, the following code adds a client-side JavaScript click handler to an HTML button element. When you click the button, the property values of the contact object are displayed using an alert() dialog:

The following demonstrates what happens when you change the value of the Name INPUT element and click the Save button. Notice that the name property of the “contact” object that the INPUT element was linked to was updated automatically:

The above example is obviously trivially simple. Instead of displaying the new values of the contact object with a JavaScript alert, you can imagine instead calling a web-service to save the object to a database. The benefit of data linking is that it enables you to focus on your data and frees you from the mechanics of keeping your UI and data in sync.

Converters

The current data linking proposal also supports a feature called converters. A converter enables you to easily convert the value of a property during data linking.

For example, imagine that you want to represent phone numbers in a standard way with the “contact” object phone property. In particular, you don’t want to include special characters such as ()- in the phone number - instead you only want digits and nothing else. In that case, you can wire-up a converter to convert the value of an INPUT element into this format using the code below:

Notice above how a converter function is being passed to the linkFrom() method used to link the phone property of the “contact” object with the value of the phone INPUT element. This convertor function strips any non-numeric characters from the INPUT element before updating the phone property. Now, if you enter the phone number (206) 555-9999 into the phone input field then the value 2065559999 is assigned to the phone property of the contact object:

You can also use a converter in the opposite direction also. For example, you can apply a standard phone format string when displaying a phone number from a phone property.

Combining Templating and Data Linking

Our goal in submitting these two proposals for templating and data linking is to make it easier to work with data when building websites and applications with jQuery. Templating makes it easier to display a list of database records retrieved from a database through an Ajax call. Data linking makes it easier to keep the data and user interface in sync for update scenarios.

Currently, we are working on an extension of the data linking proposal to support declarative data linking. We want to make it easy to take advantage of data linking when using a template to display data.

For example, imagine that you are using the following template to display an array of product objects:

Notice the {{link name}} and {{link price}} expressions. These expressions enable declarative data linking between the SPAN elements and properties of the product objects. The current jQuery templating prototype supports extending its syntax with custom template commands. In this case, we are extending the default templating syntax with a custom template command named “link”.

The benefit of using data linking with the above template is that the SPAN elements will be automatically updated whenever the underlying “product” data is updated. Declarative data linking also makes it easier to create edit and insert forms. For example, you could create a form for editing a product by using declarative data linking like this:

Whenever you change the value of the INPUT elements in a template that uses declarative data linking, the underlying JavaScript data object is automatically updated. Instead of needing to write code to scrape the HTML form to get updated values, you can instead work with the underlying data directly – making your client-side code much cleaner and simpler.

Downloading Working Code Examples of the Above Scenarios

You can download this .zip file to get with working code examples of the above scenarios. The .zip file includes 4 static HTML page:

Listing1_Templating.htm – Illustrates basic templating.
Listing2_TemplatingConditionals.htm – Illustrates templating with the use of the if and each template commands.
Listing3_DataLinking.htm – Illustrates data linking.
Listing4_Converters.htm – Illustrates using a converter with data linking.

You can un-zip the file to the file-system and then run each page to see the concepts in action.

Summary

We are excited to be able to begin participating within the open-source jQuery project. We’ve received lots of encouraging feedback in response to our first two proposals, and we will continue to actively contribute going forward. These features will hopefully make it easier for all developers (including ASP.NET developers) to build great Ajax applications.

Hope this helps,

Scott

P.S. [In addition to blogging, I am also now using Twitter for quick updates and to share links. Follow me at: twitter.com/scottgu]