Archive for the ‘ASP.NET AJAX’ Category

Microsoft ASP.NET AJAX 4.0 Preview 5 Released at CodePlex

As we know, ASP.NET AJAX 4.0 Preview 4 had earlier included outstanding client-centric development features like client-side data binding & client side templates ala XAML for WPF, implementation of observer pattern from scratch in JavaScript, data view controls, support for data sources like ADO.NET Entity Framework, LINQ to SQL etc..

Microsoft has just released ASP.NET AJAX Preview 5 at CodePlex:

In Preview 5 of ASP.NET AJAX 4.0 there has been improvement on the client-side data story (data binding et al.) introduced in previous previews of ASP.NET AJAX. In this release, there has been bug fixes and feature enhancements for the following:

1.  Dynamic and recursive templates

2.  Binding Converters

3.  Compatibility with the ASP.NET UpdatePanel

The download includes the following:

–          Help file that contains API reference documentation for Preview 5 of ASP.NET AJAX 4.0

–          A Visual Studio project containing code samples for using many of the features of ASP.NET AJAX including those that were added onto the “Preview 5” bits. Here are those:

  • Examples of Data View & Client Template usage with .NET ASMX Web Service, Wcf Service, ADO.NET Data Service both in declarative and imperative ways.
  • Master Detail Live Binding scenarios with ADO.NET DataContext for CRUD (Create, Read, Update, Delete) operations.
  • ObservableData with JavaScript which has been implemented from scratch using the classic observer design pattern.
  • JSONP Usage.
  • Recursive Template Usage.

Two new script files have been included with the download for UpdatePanel compatibility issues basically:



Here I am describing few of the major changes in this release as were outlined in the release notes:

Declarative Attribute Changes

It is no longer necessary to include a sys:activate attribute on the body of a page containing declarative markup.

Top Level Bindings

Support for “top level” expressions and bindings. Previously these were only supported within the context of a template marked with sys-template. For example, to bind the value of an input to a javascript object, you might do this:

<input sys:value="{binding bar,source={{foo}} }" />

This binds the value to the ‘bar’ field of a global ‘foo’ object. You can use other bindings to update the value, or directly with Sys.Observer:

Sys.Observer.setValue(foo, “bar”, “newValue”);

Binding the content of an element as text or HTML

You may bind to the content of a node using the new sys:innertext and sys:innerhtml attributes. Choose the appropriate attribute depending on whether or not you want to allow HTML in the value to be interpreted as HTML. For example, if you have a variable named ‘foo’ set to the value “<p>hello</p>”:

<div sys:innertext=”{{ foo }}”></div>

Will result in seeing <p>hello</p> in the browser.

<div sys:innerhtml=”{{ foo }}”></div>

Will result in the <p> tag being interpret as a paragraph tag.

The difference is in how the value is inserted. “sys:innertext” injects a text node with the given value. “sys:innerhtml” sets the innerHTML of the target element. Note that while “innerText” is an Internet Explorer only concept, “sys:innertext” is not an Internet Explorer only attribute. The name is semantically correct, despite it being implemented differently than IE’s native innerText field.

DataView Improvements

DataView now has the following events:

Binding Converters and Expandos

Bindings now support the concept of named converters that are set onto the Sys.Binding.converters field. There are none out of the box, but you may now define your own and refer to them by name. For example:

{binding foo,convert=myconverter}

This would look for a converter defined like so:

Sys.Binding.converters.myconverter = function(valueToConvert, binding) {

// convert

In addition, you may now set expandos onto the binding object and refer to them from your converter. This allows you to semantically describe what you want in a binding in any custom way you require for any specific binding. It allows you to parameterize a converter function. For example, this example sets a ‘format’ expando on the binding object despite that not being a field or property the binding natively has:

{binding foo,convert=format,format=MM/dd}
Sys.Binding.converters.format = function(value, binding) {

// binding.format === MM/dd


UpdatePanel Support

Preview 4 was not compatible with UpdatePanel in ASP.NET 3.5 due to changes to the data format UpdatePanel renders, and the inline script it renders in ASP.NET 4.0. The 4.0 scripts are now designed to work with either 3.5 or 4.0 on the server. To support UpdatePanel with these scripts, you must replace the partial rendering script (MicrosoftAjaxWebForms.js) with the 4.0 version. If you do not use an update panel, you must disable partial rendering.

Weekly Link Roundup – 1

Links published on April 13, 2009:

101 Essential Resources For Freelancers

This article contains:

  • Must Read Articles For Freelancers
  • Blogs Freelancers Should Subscribe To
  • Forums For Freelancers
  • Where To Find Freelancing Gigs
  • Useful Tools For Freelancers
  • Freelancer Survey Results

Interesting Web Development Related Resources

This article contains resources on JavaScript, jQuery, CSS, ASP.NET AJAX etc.

10 Creative & Rich UI & How to Create Them

10 creative & rich UI in modern day websites and how you can create similar interfaces using the techniques mentioned in this post.

jQuery UI provides a comprehensive set of core interaction plugins, UI widgets and visual effects that use a jQuery-style, event-driven architecture and a focus on web standards, accessibility, flexible styling, and user-friendly design. All plugins are tested for compatibility in IE 6.0+, FF 2+, Safari 3.1+, Opera 9.0+, and Google Chrome.

CSS Dock Menu ala KDE

See it to believe it. It has quite amazing resemblance to the KDE environment or Apple Macintosh like UI.

Simple Round CSS Links ( Wii Buttons ): Quite a nice way to embellish your buttons or links through CSS. Give it a try.

Nice Bubble Tooltips written with JavaScript. The balloon like feature is attractive.

Programmer Competency Matrix: Very interesting way to calculate capability index for your fellow developers or yourself as a matter of writing!

20 Things Programmers Say When Something Is Not Working

This is a very funny yet a true representation of events during software development life-cycle.