I've posted a first version of my wwHoverPanel control which provides some easy to use and high level remote call/AJAX functionality for ASP.NET Web applications. Since I originally posted a sample with my ScriptCallbacks samples some months ago there have been a lot of requests to post this control. I actually had posted it with several of my sessions given at various CodeCamps and user groups recently, but the control hadn't been quite finished and not documented. I spent a bit of time over the last week or so adding some functionality, adding documentation (which I needed to do anyway since this is part of our West Wind Web Store package) and creating some additional demos in preparation for my session at ASP.NET Connections.

This AJAX control is a control that provides a number of AJAX functionalities that I've been using in my own work into a single control that is easy to use. It's a fairly simple control that provides some core functionality and forgoes some of the fancy stuff that many other implementations are heading to (specifically ATLAS, Anthem and Ajax.NET all of which are heavily investing in AJAX driven 'stock' controls). I find that while these control driven architectures are fine they don't really address the business scenarios I work with – in those scenarios more core functionality that deals with passing application data back and forth and bringing down HTML snippets from the server are key.

Some of the concepts here aren't particularily new. Specifically the page callback functionality borrows heavily from Jason Diamond's MyAjax.Net/Anthem's original theme with some improvements from my end.

You can find the download, documentation and a link to the samples here:

http://www.west-wind.com/tools/wwHoverPanel/

The control is free comes with source code and the samples so you can check out in detail how it works, modify and tweak it. Note at the moment the code is for ASP.NET 2.0 only although the control itself includes only a few minor features that are 2.0 specific.

Here's what the control does:

• HoverPanel Behavior
  You can drop this control onto a form and tell it to retrieve content from a URL and display it in a hover panel that pops up at the current mouse position of the page. The hover window pops ontop of the current content and retrieves its content asynchronously without reposting the entire page. Operation is by setting a base URL on the control, then calling a JavaScript generic function StartCallback() with the name of the control, the event object and an optional dynamic querystring on the appropriate even like a onmouseover. (example)

• Page Method Callback
  In CallPageMethod mode the control allows you to callback onto the server and execute a method of the currently running ASP.NET page. Methods that are exposed to AJAX callbacks must have a [CallbackMethod] attribute. Server side methods can have normal .NET parameter and return value signatures with values marshaled two-way via JSON serialization. The JSON serializer works with most plain .NET objects including nested objects, nested arrays and collections as well as DataSet/DataTable/DataRow. The deserializer works with most simple objects including nested objects and nested arrays and IList implementing collections. The idea is that you can pass an object from the server to the client side, manipulate the object and pass it back. The control creates a client side wrapper object for the server methods, so you simply call the method with the same parameters that exists on the server, plus a Callback_Handler pointer to a function that handles the request. The function returns a single value that will be the result, or an exception object you can check for. Note that DataSet/Table/Row are not support for serialization back to the server! (examples: 1 2 3)

• Urlbased Callbacks
  You can also create a generic callback to another page in your Web application, retrieve the content and pass it back to a specified function. This is a very simple mechanism where you simply drop the control on the page add a client event handler that receives the result in the ClientEventHandler property and that method is called. (example)

Multiple Controls

You can drop multiple copies of the control on the page, so if you want multiple hover windows you'd assign one to each of these controls. The Urlbased Callbacks too map one callback to one handler.  Page level method callbacks only require one control on the page for all the methods that are published (you might need multiples if you have multiple simultaneous callbacks going).

Some other useful features

• Set how to pass data back to the server (GET,POST,POSTNoViewState)
• Set how the script code is embedded (WebResource,ExternalFile,EmbeddedInPage)
• Automatically delay execution of the request (great for hoverpanels)
• Automatic Callback detection (HoverControl.IsCallback)
• Set Panel Opacity and Shadow

There's also some level of lower level control through Javascript code with a Context object for a particular control that maps most of the control properties, and low level methods like StartCallback and CallMethod that can be used directly from script to call back to the server.

Why this control?

You might ask, why this control? After all ATLAS is on its way and Anthem and Ajax.NET already live in this space. My biggest concern for ATLAS is that, well, it's not here yet and it looks actually quite a ways off yet. The last CTP was December and it completely broke the PDC functionality in almost all respects. So it's not something you can use today. I've really enjoyed Jason Diamonds MyAajax.NET/Anthem, but in recent months one it moved to SourceForge there have been so many break the build releases that I ended up not getting recent versions. There's a lot of feature creep from the original simple implementation which was nice and easy to integrate and work with. This may have changed now that it has actually gone V1.0. Ajax.NET is also another option and it's probably the most popular AJAX library out at the moment. I personally never got into this particular library because I felt it was more complex than it needed to be. In essence the theme between it and Anthem are similar although I feel that Anthem is the cleaner implementation. Personal choice and I'm sure others will disagree.

So this control fits somewhere on the lower end and doesn't go down the route of AJAX controls but rather focuses on getting content to your client application as easy as possible. The HoverPanel and Page Callback behaviors can be accomplished without writing any code other than the event handler. The Callback method that maps a client side class to the server published page methods is about as easy as it gets and was originally provided by Anthem.

I think the implementation of the callback interface is simpler than any of the other implementations, resulting in more efficient code especially for method callbacks.

One thing that Anthem was missing is two-way JSON support, which to me is important. I want to be able to pass an object to the client, modify it and send it back. For business scenarios this seems crucial and one of the most logical ways to do this. Now the JSON support in this control is spotty. Serialization is pretty good, but deserialization basically relies on Reflection and instantiation of objects on the server then populating public fields and properties with the values returned via JSON. For this to work with objects, the objects and all child objects must support parameterless constructors or arrays and collections. IOW, sending things up from the client might not work as smoothly.

Another feature is the ability to control how POST data is passed back to the server. In a lot of situations it makes good sense to send back the POST buffer from the client rather than passing an object back through a method call. Rather the control encodes all the form data and posts it back to the server. You can control if and how the data goes back with GET (no posting back), POST (posting full data including ViewState), POSTNoViewState modes to control the data. No ViewState can be handy if you have a lot of viewstate on the original page that loads. If you do post ViewState though ASP.NET will re-assign control value automatically so you can reference this.txtCompany.Text from within a callback. This will work for any control that has its state set entirely through POST data (like textboxes/checkboxes) but may not work for controls that rely on code to fill the data first like lists for example. In those cases you either need to make sure ViewState is enabled on these controls so the data gets restored through ViewState or you have to use an Explicit Request.Form["ListControl"] to retrieve the value. While this may seem hokey compared to passing values back via a method call, it's often much easier to write code on the server than trying to re-populate an object with the values from controls in Javascript code. I tend to rely on POST data extensively with the apps I've worked on.

So anyway, take a look, play around and let me know if you find a bug or think of some enhancements . Ok, I'm asking for trouble I'm sure…