Andy Butland

Having recently had to work on a client website where jquery wasn't available, it was really apparent just how useful this library is and how pleasureable it makes working with JavaScript. Having to resort back to getElementById and getElementsByClassName was painful in comparison. Today I discovered and made use of yet another useful feature - the trigger method which enables an action on one element to fire the functions associated with events on another. I had a simple accordion style user interface that looked like this: On clicking the cross on the right a panel below would expand and display the content. The mark-up looked like this:     1   < ul id ="list">     2      < li >     3          < div class ="head"> Title </ div >     4          < a href =""> + </ a > ...

With its clean model for separation of concerns, one of the things I’ve been impressed by in use of MVC with ASP.Net is the support for building AJAX enabled applications that support progressive enhancement. This technique takes the traditional strategy of graceful degradation in web design and turns it on its head. Rather than focussing on having the best possible user interface degrade to a less rich but still workable and presentable one, the focus is on creating a functional base UI that is enhanced by the addition of CSS and JavaScript to produce an improved user experience for those that can make use of it. Of course either method can lead to the same result, but – in addition to the use of some specific techniques such as external referencing of assets to avoid swamping the more basic client with code or data that can’t be used – the change of approach leads to a different design mindset and result that better supports the full user base. In this post I’ll illustrate a sma...

One of the main pluses of working with the ASP.Net MVC framework is of course the separation of concerns it promotes with the split between the controller and the view in the UI. This is not only apparent in the standard method of having the controller obtain the data required for display, and passing this to a view for display as XHTML. The same clear separation of purpose can be made use of when the output of the view is other formats too. In a recent project I've had need to represent a calendar of events - a simple side bar to the website that displays a calendar view with days that have events associated with them highlighted. Clicking on the day displays the list of events below. In implementing this feature I made use of the controller and view pattern in three distinct ways. Having a controller render an XHTML page view Having a controller render JSON data for use from an AJAX request . Having a controller render a partial view to support an AJAX page update . Applicat...

As mentioned in a related post, I've been granted a developer key for the Guardian Open Platform and have used it to put together a website displaying interactive cricket scores and reports . This post details how I've put this together. Web Service Back End The application is in two parts. My initial thoughts were to build this purely on the client side using jquery - the API provides JSON as well as XML response formats. But of course this would mean exposing my developer key to anyone who thought to "view source"... and I expected the Guardian wouldn't be too pleased with that. So instead I set up a web service, that will be called by the client side code AJAX style, in order to protect this information. I also took this opportunity to simplify the output going to the client side code to what I really needed, in order to ease the complexity of the JavaScript manipulations. The API provides a means of loading the full details of any piece of content via a...