In my last post on ASP.NET AJAX 4.0, we took a look at the new DataView ASP.NET AJAX control . We saw that by using a DataView, we could easily bind data with JavaScript or declaratively with a few attributes. In this post, we’ll look at another feature of the ASP.NET 4.0 AJAX Library, the Observer design pattern for plain JavaScript objects. The pattern is implemented in the client side Sys.Observer class. This feature is used internally within the new version of ASP.NET AJAX for live-binding and the DataView control . Here we will be using Preview 4 of the ASP.NET AJAX Library, which can be downloaded from CodePlex . Remember that these components are still in “preview” mode (meaning no Microsoft support), though they are usable at your own risk. For more information, you can check out the license on CodePlex. I highly recommend downloading the samples available for Preview 4, which are also available at CodePlex . The samples give you a good look at what is coming. In this post, we’ll take a closer look at the Sys.Observer class, witness the problems it solves, and take a look at a few examples. A Quick Look at JavaScript Objects To this day, I still know developers who either don’t understand, don’t want to understand, or flat out loathe JavaScript. I suppose this really has to do with it being totally misunderstood , but in a Web 2.0 world, a web developer should embrace the language. Especially with wonderful frameworks like jQuery and the Microsoft AJAX Library This section is a quick overview of JavaScript objects in case you aren’t familiar with them. Objects in JavaScript can be described as hashtables, they are collections of names and values, for example: // An empty object var person = {}; // Another way of defining an object var person2 = new Object(); // Adding a name/value pair (a local variable) person[ "firstName" ] = ‘Damien’ ; // You can also use the dot notation instead of subscript notation person.lastName = ‘White’ ; // And you can define objects using the object literal notation var person = { firstName: ‘Damien’ , lastName: ‘White’ }; This is by no means definitive. If you have JavaScript-phobia, you should start here . The Object Modification Problem Let’s say you have a simple object with a couple of properties. Note that JavaScript doesn’t have properties as we know them in .NET, they are just local variables like those defined on the person object in the previous code snippet, however there are conventions for emulating them with functions. Back to our simple object, let’s say that you need to be notified if the object changes. Take the following snippet, note I’m using the jQuery in order to simplify the code (e.g.
Here is the original post:
ASP.NET 4.0 AJAX – Preview 4 – JavaScript Observer Pattern






