Blog

Event Messaging on the client side with jQuery

events

How many times have you come across the following kind of code in JavaScript

// code in script-1.js
// eek, two global variables!
var dialog,
updateMessage = function updateMessage (message) {
      dialog.text(message);
}

// function to run when the DOM has loaded
$(function () {
      // #dialog is just a simple <p> element
      dialog = $('#dialog');
});

then in another script file

// code in script-2.js
// function to run when the DOM has loaded
$(function () {
      $('select').change(function () {
            // update the dialog with the new selection
            updateMessage('the new value is ' + this.value);
      });
});

All we’re doing here is updating the text of a <p> element in the DOM whenever the value of a <select> element changes. It’s a contrived and trivial example but it perfectly demonstrates the tight coupling between these two script files; if the updateMessage function is renamed, removed or modified to reorder the parameters (let’s put aside the use of arguments for a moment), this is going to break script-2 at runtime. What’s more, usually with these kinds of changes, it’s too easy to forget to search through all script and markup-related files for function usages and modify accordingly. And further still, it's polluted the global namespace with two additional variables (a big no no in JavaScript development), dialog and updateMessage, to allow script-2 access to the updateMessage function (which needs access to the dialog variable). There has to be a better way, and there is.

Read more...

Managing Scripts for Razor Partial Views and Templates in ASP.NET MVC

UPDATE 13-03-2013: I've created a nuget package for the helpers. The original ScriptContext scope had to be brought back in for MVC 4 as the TemplateStack approach no longer worked.
UPDATE 21-11-2011: After some digging through the MVC framework code, I've come up with a slightly cleaner solution that doesn't require ScriptContext to implement IDisposable and therefore removes the need to create a "scope" for the scripts. Skip to the end to see the update.

The view engine in ASP.NET MVC is flexible, very flexible. With great flexibility comes great responsibility however, and managing JavaScript files and code blocks can be particularly cumbersome in conjunction with partial views and templates.

Read more...

C# 5 asynchronous programming

If you missed Anders Hejlsberg talk on the Future directions for C# and Visual Basic, go check it out now, I’ll wait.

Read more...

Implement Recaptcha properly in ASP.NET MVC

Love them or hate them, the humble CAPTCHA is a tried and trusted approach to mitigating spam content from infiltrating your beautifully crafted application and flooding it with adverts selling all kinds of nefarious goods. Whilst their effectiveness is debatable and the frustration that they bring about in some high, they are relatively simple to use and catch the bulk of user defined content one would want to filter from their site.

Read more...

Resolving IoC container services for Validation Attributes in ASP.NET MVC

I'm a fan of the Data Annotation Validation attributes to validate user input on both the client and server side for ASP.NET MVC applications. I'm also a fan of Inversion of Control and Dependency Injection to create loosely coupled and flexible applications. There are certain situations where one would wish to inject services into a validation attribute to use during validation; a (somewhat contrived and security cautious) example of this might be providing the user with a <select> element and ask them to choose an option from it and then validate that the option that they have chosen is one that actually exists for the type of items represented in the dropdown. Sure, the RemoteAttribute would allow you to call a server side method via AJAX to perform validation but it does not provide any server side validation, making it more of a convenience solution than a complete and robust one. What would be good is if we could

  1. provide services to a validation attribute that could be used in the process of validation
  2. Not have to explicitly resolve services from the container à la the Service Locator (Anti-)Pattern

Read more...

ASP.NET MVC Permanent 301 redirects for legacy routes

Having a good url routing scheme is extremely important when developing an application. Urls should be canonical to aid in search engine optimization and discoverable in order to aid users in learning where to find application functionality for particular tasks. But there are points in an applications lifecycle where one wishes to change the url routing scheme in order to employ a better one. In such instances, URL redirection can be used to preserve search engine rankings, user bookmarks to specific pages or to allow more than one URL to serve up the same content, as is the case when employing URL shortening.

Read more...

Event Internals in jQuery - Part Two

Part one of jQuery Event internals looked at the DOM Event specifications, the history of the Document Object Model (DOM) event models and reasoning behind why jQuery has an event system. In the second part of this series, we'll be looking at the jQuery.event object and jQuery.Event constructor function, both of which play a pivotal role in managing events. Previously, we looked at the bind() method (and the related specific event handler binding methods such as click(), keyup(), etc) and saw that bind() eventually calls jQuery.event.add, so let's start by looking at that.

Read more...

Event Internals in jQuery - Part One

I've been using jQuery for a number of years now and think it's an awesome JavaScript library for providing a rich client experience to web applications with little effort.  Whilst I advocate the use of jQuery to quickly and effectively build your client side solutions, I also think that it's important to understand what's going on under the hood, particularly as it can help to quickly pinpoint a bug in your own code (and on the rarest of occasions, a bug in the library code).

Read more...

ASP.NET MVC 3 IMetadataAware and custom ModelMetadata attributes

UPDATE: I've added a simple example project up on bitbucket to demonstrate the ColorPicker attribute

ASP.NET MVC 3 introduces a new interface, IMetadataAware, for providing additional values to the model metadata at creation time:

/* ****************************************************************************
 *
 * Copyright (c) Microsoft Corporation. All rights reserved.
 *
 * This software is subject to the Microsoft Public License (Ms-PL). 
 * A copy of the license can be found in the license.htm file included 
 * in this distribution.
 *
 * You must not remove this notice, or any other, from this software.
 *
 * ***************************************************************************/

namespace System.Web.Mvc {
    // This interface is implemented by attributes which wish to contribute to the
    // ModelMetadata creation process without needing to write a custom metadata
    // provider. It is consumed by AssociatedMetadataProvider, so this behavior is
    // automatically inherited by all classes which derive from it (notably, the
    // DataAnnotationsModelMetadataProvider).
    public interface IMetadataAware {
        void OnMetadataCreated(ModelMetadata metadata);
    }
}

Read more...

This Developer's Life

I'm probably a little late to the party on this one, but I have just started listening to This Developer's Life, a podcast presented by Rob Conery and Scott Hanselman. Each episode focuses on a particular topic in the realm of development and technology in general and involves interviews and stories from some of the most well known faces in the industry. There are some genuine legends, both past and more recent, shooting the breeze for our listening pleasure. These stories are interspersed with some great choices of music and short stories from the two presenters. I think there's something in there for everyone interested in technology and, like me, you'll probably find yourself relating to more than one of the topics brought up.

Read more...