Jeremiah Clark's Blog

Visual Studio Unit Testing Extensions v1.2.0.0

Jeremiah.Clark — Tue, 07 Feb 2012 17:21:00 GMT

Version 1.2.0.0 of these Unit Testing Extensions are available on CodePlex today. The original post that talks about the project can be found here . An updated NuGet package is also available . This release contains additional assertions on IEnumerable<T>...(read more)

PowerShell and SQL Server Compact 4.0: A Happy Mix

Jeremiah.Clark — Tue, 09 Aug 2011 01:53:03 GMT

Using SQL Server Compact 4.0 from PowerShell is easy and powerful. Here is an example that shows how to reference the needed libraries, create the database, and add a table to the database – all from PowerShell. 1: $binpath = "C:\Program Files\Microsoft...(read more)

ASP.NET MVC: Fun With Routes

Jeremiah.Clark — Tue, 25 Jan 2011 01:10:00 GMT

For the purposes of this post, let’s say that we are building a community blogging site. We want multiple users to be able to maintain separate blogs on the site. We have an area in our MVC application that is called Blogs . We have...(read more)

Visual Studio Testing Extensions now available on NuGet

Jeremiah.Clark — Thu, 20 Jan 2011 20:02:00 GMT

I have become a huge fan of NuGet lately. It really makes managing references and dependencies a lot easier. If you are not familiar with NuGet, here is the description from its site: NuGet (formerly known as NuPack) is a free, open source developer...(read more)

Book Review – Microsoft .NET: Architecting Applications for the Enterprise

Jeremiah.Clark — Wed, 05 Jan 2011 05:01:00 GMT

For the entire month of January, I am doing the Daddy Day Care thing for our 4 month old twins. Since I can’t really work during this time, I figured that it would be a good chance to catch up on some reading that I have been putting off. This book...(read more)

Visual Studio Unit Testing Extensions v1.1.0.0

Jeremiah.Clark — Fri, 03 Dec 2010 20:15:00 GMT

I just released version 1.1.0.0 of these Unit Testing Extensions on CodePlex today. The original post that talks about the project can be found here . This release contains additional assertions on DateTime, ICollection<T>, and String. This release...(read more)

2010 – A New Year, Some New Goals

Jeremiah.Clark — Sat, 09 Jan 2010 05:21:00 GMT

Like most people, I assume, every new year I come up with a set of goals that I would like to accomplish during the upcoming year. But I never seem to write them down, so I always forget what my plan was by the time February rolls around. So starting...(read more)

ServiceLocator and Unity – Be Careful

Jeremiah.Clark — Tue, 12 May 2009 22:00:00 GMT

Chris Tavarez has provided a handy adapter ( UnityServiceLocator ) for using ServiceLocator to resolve types from a Unity container. You can then use ServiceLocator.SetLocatorProvider() to register the UnityServiceLocator as the default provider for ServiceLocator...(read more)

Tip: Entity Framework, Unity, and The ASP.NET RoleProvider – Read the MSDN Fine Print

Jeremiah.Clark — Mon, 11 May 2009 21:28:00 GMT

A custom Role Provider is a very useful tool for adding custom authorization to your ASP.NET and/or ASP.NET MVC applications. A common use for a custom Role Provider is when you have role information stored in a data store that differs from the schema...(read more)

Testing Your Unity XML Configuration

Jeremiah.Clark — Sat, 04 Apr 2009 01:02:00 GMT

When using Unity as your IoC container , one way to configure the container is to use an configuration section in your app.config or web.config file. A simplified example of this configuration is shown below: 1: <? xml version ="1.0" encoding...(read more)

Unit Testing The MVC JsonResult

Jeremiah.Clark — Wed, 25 Feb 2009 08:12:00 GMT

One of my favorite features of ASP.NET MVC is the support for JSON . In MVC, an Action Method in a Controller can return a JsonResult. This really comes in handy when integrating with jQuery to provide AJAX-like functionality in an application. In...(read more)

The Plethora Of Prodigal Patterns

Jeremiah.Clark — Tue, 17 Feb 2009 19:30:00 GMT

"Make everything as simple as possible, but not simpler" Albert Einstein With all of the software design patterns available to developers, I think that we sometimes lose focus of the pragmatic development approach: Write code that works. Don’t...(read more)

25 Random Things About Me

Jeremiah.Clark — Wed, 11 Feb 2009 02:49:00 GMT

There is a meme going around Facebook where everyone is writing 25 random things about themselves. I thought I would share this on my blog as well. So without further ado, here are some random facts about me: 1. I get really annoyed when people...(read more)

Are Software Developers Really Engineers?

Jeremiah.Clark — Sun, 08 Feb 2009 11:37:00 GMT

A few co-workers and I lately have been having this conversation. The following hypothetical argument illustrates the con of the argument: How can we be engineers if we can’t agree on what we’re building? Do engineers have conversations...(read more)

Dynamic Expression Trees

Jeremiah.Clark — Fri, 06 Feb 2009 10:30:00 GMT

I have been working on a project that uses the Entity Framework as the persistence store. I am implementing a global search capability that returns results from the various entities that have a string property that start with a given query string. So...(read more)

Visual Studio Unit Testing Extensions v1.0.0.0 - Continued...

Jeremiah.Clark — Wed, 04 Feb 2009 01:29:00 GMT

Last night I wrote a post about the Visual Studio Unit Testing Extensions that I put out on CodePlex. I forgot to mention one of my favorite features that the library provides.

I showed how you can use the library to write readable unit tests like the following:

[TestMethod]

public void NewWay_Test()

   int number = 5;

   number.ShouldEqual(5);

   number.ShouldBeGreaterThan(4);

   number.ShouldBePositive();

Another feature of this library is the ability to chain assertions. Each assertion method returns the original source value, so the same test above can also be written the following way:

[TestMethod]

public void NewWay_Test()

   int number = 5;

   number.ShouldEqual(5)

      .ShouldBeGreaterThan(4)

      .ShouldBePositive();

I think that this makes the unit test even more readable and also reduces the amount of code that is needed.

If you can think of any features or assertion methods that you would like to see added to the library, please let me know either by commenting on this post or at the CodePlex discussion site.

Visual Studio Unit Testing Extensions v1.0.0.0

Jeremiah.Clark — Tue, 03 Feb 2009 10:07:00 GMT

This is a personal hobby project that I have been working on recently. The code has been released on CodePlex and can be found here.

The Visual Studio Testing Extensions is a library that exposes a set of extension methods to provide a way to write more readable unit tests in the Visual Studio Unit Testing environment. It is developed in C# using Visual Studio 2008.

This project was created to add to the basic assertions that unit testing in Visual Studio (VS) provides. In VS, the way to do unit testing assertions is to write test code such as the following:

[TestMethod]

public void OldWay_Test()

   int number = 5;

   Assert.AreEqual(number, 5);

   Assert.IsTrue(number > 4);

   Assert.IsTrue(number > -1);

While this approach is sufficient for most cases, I was looking to provide a more readable way to write unit tests. This library contains a number or extension methods that allow you to perform assertions using the following syntax:

[TestMethod]

public void NewWay_Test()

   int number = 5;

   number.ShouldEqual(5);

   number.ShouldBeGreaterThan(4);

   number.ShouldBePositive();

When an assertion fails, the failure notification is the same behavior that VS provides out of the box, displaying the assertion that caused the failure and the arguments associated with the assertion.

The other feature that this library provides is the ability to assert multiple expected exceptions in a single test method, rather than being limited to one expected exception like VS provides. You can provide the snippet to test for an exception via an Action() delegate. An example of this is shown below:

[TestMethod]

public void Testing_ExceptionsTest()

   int zero = 0;

   Testing.ShouldThrowException<DivideByZeroException>(() => { int y = 15 / zero; });

   Testing.ShouldThrowException<ArgumentNullException>(() => { throw new ArgumentNullException(); });

The source release for this project contains a complete suite of unit tests to validate the expected functionality that the library provides. In addition, the unit tests are a good example of the various extension methods that the library provides.

If you are interested in contributing to this project, please let me know.

Provide Caching For Your Complex Functions

Jeremiah.Clark — Mon, 08 Dec 2008 07:42:32 GMT

Function caching, or more specifically memoization, is a code optimization technique that can be used to speed up code that calls complex functions with the same inputs. Let's take a look at the classic fibonacci function:

   1: private int Fib(int val)

   2: {

   3:     return val <= 2 ? 1 : Fib(val - 2) + Fib(val - 1);

   4: }

This is a recursive function that computes the nth value of the fibonacci sequence, where n is passed as an argument to the function. As the value of n increases, the time taken to compute the result increases. If this function is called multiple times with the same input, the cost associated with the calculation is incurred each time. It would be nice if we could cache the results of the first call for a specific input and then if the function is called again with the same input, we just return the result from the previous call. It would also be nice if we could provided a generic way to do this so that it would apply to any type of function. In this post, I will share a few classes that I wrote to facilitate this type of function caching.

The following code is a class that provides the caching mechanism for a given function that consists of a single argument.

   1: public sealed class CachedFunction<T, TResult>

   2: {

   3:     private Func<T, TResult> _function;

   4:     private int _cacheSize;

   5:     private Dictionary<T, CacheInformation<T, TResult>> _cache;

6:

   7:     // The constructor for the CachedFunction class.

   8:     private CachedFunction(Func<T, TResult> function, int cacheSize)

   9:     {

  10:         this._function = function;

  11:         this._cacheSize = cacheSize;

  12:         this._cache = new Dictionary<T, CacheInformation<T, TResult>>(this._cacheSize);

  13:     }

14:

  15:     // A factory method that created a new instance of the CacheFunction class with the default cache size.

  16:     public static CachedFunction<T, TResult> Create(Func<T, TResult> function)

  17:     {

  18:         return Create(function, 10);

19:

  20:     }

21:

  22:     // A factory method that created a new instance of the CacheFunction class.

  23:     public static CachedFunction<T, TResult> Create(Func<T, TResult> function, int cacheSize)

  24:     {

  25:         if (function == null)

  26:             throw new ArgumentNullException("function");

  27:         if (cacheSize <= 0)

  28:             throw new ArgumentOutOfRangeException("cacheSize", Resources.ArgumentOutOfRangeExceptionIntLessThanOneMessage);

29:

  30:         return new CachedFunction<T,TResult>(function, cacheSize);

  31:     }

32:

  33:     // This method is called to execute the function with the argument specified.

  34:     // If the argument exists in the cache, the cached result is returned, otherwise

  35:     // the original function is called and the result is added to the cache.

  36:     public TResult Execute(T arg1)

  37:     {

  38:         if (this._cache.ContainsKey(arg1))

  39:             return this.GetReturnFromCache(arg1);

  40:         else

  41:         {

  42:             TResult returnValue = this._function(arg1);

  43:             this.AddToCache(arg1, returnValue);

  44:             return returnValue;

  45:         }

  46:     }

47:

  48:     // This method adds a new argument/result pair to the cache.  If the size

  49:     // if the cache dictionary exceeds the cache size value, then the oldest cached

  50:     // result with the smallest number of executions is removed from the cache.

  51:     private void AddToCache(T argument1, TResult returnValue)

  52:     {

  53:         if (this._cache.Count >= this._cacheSize)

  54:         {

  55:             int min = this._cache.Min(x => x.Value.ExecutionCount);

  56:             this._cache.Remove(this._cache.First(x => x.Value.ExecutionCount == min).Key);

  57:         }

58:

  59:         this._cache.Add(argument1, CacheInformation<T, TResult>.Create(argument1, returnValue));

  60:     }

61:

  62:     // This method returns a function result from the cache that corresponds

  63:     // to the given argument.

  64:     private TResult GetReturnFromCache(T argument1)

  65:     {

  66:         return this._cache[argument1].ReturnValue;

  67:     }

  68: }

The cache dictionary in the code above contains a class that represents the functions argument, return value, and the number of times that this instance of the function has been called. That code is shown below:

   1: internal sealed class CacheInformation<T, TResult>

   2: {

   3:     private TResult _returnValue;

   4:     private int _executionCount;

5:

   6:     private CacheInformation(T argument1, TResult returnValue)

   7:     {

   8:         this.ExecutionCount = 0;

   9:         this.Argument1 = argument1;

  10:         this.ReturnValue = returnValue;

  11:     }

12:

  13:     public static CacheInformation<T, TResult> Create(T argument1, TResult returnValue)

  14:     {

  15:         return new CacheInformation<T, TResult>(argument1, returnValue);

  16:     }

17:

  18:     public T Argument1 { get; private set; }

19:

  20:     public TResult ReturnValue

  21:     {

  22:         get

  23:         {

  24:             Interlocked.Increment(ref this._executionCount);

  25:             return this._returnValue;

  26:         }

  27:         private set

  28:         {

  29:             this._returnValue = value;

  30:         }

  31:     }

32:

  33:     public int ExecutionCount

  34:     {

  35:         get

  36:         {

  37:             return this._executionCount;

  38:         }

  39:         private set

  40:         {

  41:             this._executionCount = value;

  42:         }

  43:     }

44:

  45: }

Now let's take a look at how we can implement the same fibonacci function that we started with, but this time with the caching mechanism that we have implemented.

   1: private CachedFunction<int, int> myFunc;

2:

   3: public Program()

   4: {

   5:     myFunc = CachedFunction<int, int>.Create(x => Fib(x));

   6: }

7:

   8: private int Fib(int val)

   9: {

  10:     return val <= 2 ? 1 : Fib(val - 2) + Fib(val - 1);

  11: }

12:

  13: public int DoFib(int val)

  14: {

  15:     return myFunc.Execute(val);

  16: }

17:

  18: static void Main(string[] args)

  19: {

  20:     Program p = new Program();

  21:     Console.WriteLine(p.DoFib(40));

  22:     Console.WriteLine(p.DoFib(39));

  23:     Console.WriteLine(p.DoFib(40));

  24:     Console.WriteLine(p.DoFib(39));

  25:     Console.WriteLine(p.DoFib(39));

  26:     Console.WriteLine(p.DoFib(39));

  27:     Console.WriteLine(p.DoFib(39));

  28:     Console.WriteLine(p.DoFib(40));

  29:     Console.WriteLine(p.DoFib(40));

  30:     Console.WriteLine(p.DoFib(40));

  31:     Console.WriteLine(p.DoFib(40));

  32: }

When the code above is executed, the first two calls will take some time to compute and then the following calls will return immediately with the cached result for 39 and 40.

This concept only provides value for functions that take some time to compute. If the function is simple, like returning the square of an input, the cost associated with caching may outweigh the cost of the actual operation. But in the case of something rather complex, this can save a lot of time if the inputs to a function are likely to be the same.

The example I provided also only works for a function that takes a single argument, but this could be easily modified using a Tuple to provide support for functions that take multiple arguments.

Extending MVC: Auto Refreshing A Partial View Using AJAX

Jeremiah.Clark — Sun, 16 Nov 2008 10:50:49 GMT

This is something that I put together in a few minutes to provide a way to refresh a partial view on a specified time interval.

Let's create a MVC User Control that displays the current date and time called "TimeControl.ascx":

   1: <%@ Control Language="C#" AutoEventWireup="true" CodeBehind="TimeControl.ascx.cs" Inherits="SAWeb.UI.Views.UserControls.TimeControl" %>

   2: <div>

   3: <%= DateTime.Now.ToString() %>

   4: </div>

We can render this in a view using the Html.RenderPartial() method. How can we update this control using AJAX? MVC provides an Ajax.ActionLink() helper method that we could use. An example of this can be found here and here. The only problem with this is that you have to click a link to update the control. What if we want it to automatically update the partial view control via AJAX on a certain time interval, like every 5 seconds? To do this, I have created a helper method that provides this functionality.

The code for the helper method (Html.RenderPartialRefresh) is shown below:

   1: public static class RenderExtensions

   2: {

   3:     // Extension method to render a partial view every interval specified.

   4:     public static void RenderPartialRefresh(this HtmlHelper htmlHelper, string name, string controller, string actionMethod,

   5:         TimeSpan interval, string partialViewName)

   6:     {

   7:         RenderPartialRefresh(htmlHelper, name, controller, actionMethod, interval, partialViewName, htmlHelper.ViewData);

   8:     }

9:

  10:     // Extension method to render a partial view every interval specified, and providing a model to the control.

  11:     public static void RenderPartialRefresh(this HtmlHelper htmlHelper, string name, string controller, string actionMethod,

  12:         TimeSpan interval, string partialViewName, object model)

  13:     {

  14:         if (model == null)

  15:             throw new ArgumentNullException("model");

  16:         if (String.IsNullOrEmpty(name))

  17:             throw new ArgumentException("Argument cannot be null or empty.", "name");

  18:         if (String.IsNullOrEmpty(partialViewName))

  19:             throw new ArgumentException("Argument cannot be null or empty.", "partialViewName");

20:

  21:         // Building the javascript that registers the interval and performs the AJAX request.

  22:         StringBuilder builder = new StringBuilder();

  23:         builder.Append("<script language=\"javascript\">");

  24:         builder.Append("setInterval(function() {");

  25:         builder.Append("Sys.Mvc.MvcHelpers.$1(");

  26:         builder.AppendFormat("'{0}',", GenerateUrl(htmlHelper.ViewContext, null, actionMethod, controller, new RouteValueDictionary()));

  27:         builder.Append("'post','','', { insertionMode: Sys.Mvc.InsertionMode.replace, updateTargetId: '");

  28:         builder.AppendFormat("{0}", name);

  29:         builder.Append("'});},");

  30:         builder.AppendFormat("{0});", interval.TotalMilliseconds);

  31:         builder.Append("</script>");

32:

  33:         // Wraps the partial view in a div tag so that we can update by the id of the div.

  34:         htmlHelper.ViewContext.HttpContext.Response.Output.Write(builder.ToString());

  35:         htmlHelper.ViewContext.HttpContext.Response.Output.Write("<div id=\"{0}\" name=\"{0}\">", name);

  36:         htmlHelper.RenderPartial(partialViewName, model);

  37:         htmlHelper.ViewContext.HttpContext.Response.Output.Write("</div>");

  38:     }

39:

  40:     // Method to generate the URL given the controller and action method.

  41:     private static string GenerateUrl(ViewContext viewContext, string routeName, string actionName,

  42:         string controllerName, RouteValueDictionary valuesDictionary)

  43:     {

  44:         UrlHelper helper = new UrlHelper(viewContext);

  45:         Type t = typeof(UrlHelper);

  46:         Object[] paramArray = { routeName, actionName, controllerName, valuesDictionary };

  47:         MethodInfo m = t.GetMethod("GenerateUrl", BindingFlags.NonPublic | BindingFlags.Instance);

  48:         string s = (string)m.Invoke(helper, paramArray);

  49:         return HttpUtility.HtmlAttributeEncode(s);

  50:     }

  51: }

The next step is to make sure that we have the AJAX scripts registered. In the master page or the view, ensure that you have the following script references (with the correct path to the scripts):

   1: <script src="/Scripts/MicrosoftAjax.js" type="text/javascript"></script>

   2: <script src="/Scripts/MicrosoftMvcAjax.js" type="text/javascript"></script>

And now, lets create a controller action method to return the partial view when called. In this example, we will add the action method to the Home controller, and it simply returns a View of the TimeControl.ascx partial view. This is called by the AJAX script every interval to update the partial view.

   1: [HandleError]

   2: public class HomeController : Controller

   3: {

   4:     ...

5:

   6:     // Simple action method that returns the partial view for the TimeControl.ascx

   7:     public ActionResult GetTimeControl()

   8:     {

   9:         return View("/Views/UserControls/TimeControl.ascx");

  10:     }

  11: }

Finally, to render the auto updating view, we can use the helper method that we created above, passing the name for the wrapping div ("timeDisplay"), the controller and action method to call for the update ("Home" and "GetTimeControl"), the TimeSpan for the interval (5 seconds), and the partial view to render ("TimeControl.ascx"):

   1: <h2>Auto Updating Partial View Example</h2>

2:

   3: <% Html.RenderPartialRefresh("timeDisplay", "Home", "GetTimeControl", new TimeSpan(0, 0, 5), "/Views/UserControls/TimeControl.ascx"); %>

Initially, the View will be rendered with the Date and Time of the request as shown below:

And every five seconds, the partial view control will update via AJAX (without a postback) to reflect the current time. The image below shows the same page after 80 seconds without the need for a refresh. You can see that the time has automatically updated.

The trickiest part of this was determining the javascript to perform the AJAX request. There might be a better (and cleaner) way to do this, but this is something that I put together in about 20 minutes. The goal of this is to show the power of AJAX in MVC and the ease of creating extension helpers in MVC to provide the functionality that you might need.

Extending MVC: Returning an Image from a Controller Action

Jeremiah.Clark — Fri, 14 Nov 2008 06:54:44 GMT

So I was thinking tonight, what if I want my MVC application to serve images that are stored in a SQL database as binary data? Or files that are stored in the database? One of the things that I really like about MVC is that ability to add custom functionality in a fairly simple way. A few days ago, I wrote a post showing how to implement a custom HtmlHelper method for rendering a group of checkboxes. In this post, we are going to create a custom ActionResult class that can serve an image as the return value from a controller action method.

In the typical controller action method, a View is returned. This allows the controller to render the View as the response for the web request. You are probably familiar with this if you have been using MVC. Here is a common example of this:

   1: public class HomeController : Controller

   2: {

   3:     public ActionResult Index()

   4:     {

   5:         ViewData["Title"] = "Home Page";

   6:         ViewData["Message"] = "Welcome to ASP.NET MVC!";

7:

   8:         return View();

   9:     }

  10: }

In the code above, View() is a method on the Controller class that returns a ViewResult. ViewResult is a class that inherits from ActionResult. The ViewResult class finds the associated view and renders the view to the output stream of the web response. JsonResult is another type that can be returned in an action method. JsonResult performs javascript serialization on some data and writes the serialized data to the web response.

So to answer our initial question, let's create an ImageResult class that will write the bytes of an image to the web response. The code below is fairly straightforward - we inherit from ActionResult, define some properties that we need, set the properties in the constructor, and then create and return the response.

   1: public class ImageResult : ActionResult

   2: {

   3:     public ImageResult(Stream imageStream, string contentType)

   4:     {

   5:         if (imageStream == null)

   6:             throw new ArgumentNullException("imageStream");

   7:         if (contentType == null)

   8:             throw new ArgumentNullException("contentType");

9:

  10:         this.ImageStream = imageStream;

  11:         this.ContentType = contentType;

  12:     }

13:

  14:     public Stream ImageStream { get; private set; }

  15:     public string ContentType { get; private set; }

16:

  17:     public override void ExecuteResult(ControllerContext context)

  18:     {

  19:         if (context == null)

  20:             throw new ArgumentNullException("context");

21:

  22:         HttpResponseBase response = context.HttpContext.Response;

23:

  24:         response.ContentType = this.ContentType;

25:

  26:         byte[] buffer = new byte[4096];

  27:         while (true)

  28:         {

  29:             int read = this.ImageStream.Read(buffer, 0, buffer.Length);

  30:             if (read == 0)

  31:                 break;

32:

  33:             response.OutputStream.Write(buffer, 0, read);

  34:         }

35:

  36:         response.End();

  37:     }

  38: }

The next thing that I did was create a set of extension methods for the Controller class. All that these methods do is create and return a new instance of the ImageResult class based on the arguments. This allows you to pass the image as either a stream or a byte array.

   1: public static class ControllerExtensions

   2: {

   3:     public static ImageResult Image(this Controller controller, Stream imageStream, string contentType)

   4:     {

   5:         return new ImageResult(imageStream, contentType);

   6:     }

7:

   8:     public static ImageResult Image(this Controller controller, byte[] imageBytes, string contentType)

   9:     {

  10:         return new ImageResult(new MemoryStream(imageBytes), contentType);

  11:     }

  12: }

Now that we have that done, let's create a controller action method to get the images. We just need to specify the binary image data and the content type for the image.

   1: public class HomeController : Controller

   2: {

   3:     public ActionResult Images(string id)

   4:     {

   5:         // Here is where we would take the id that was passed as

   6:         // the argument and get the image from the database or

   7:         // filesystem.  In this example though, I am just going to

   8:         // return the same image from my local hard drive

   9:         // regardless of the id parameter.

10:

  11:         byte[] image = File.ReadAllBytes(@"C:\netLogo.jpg");

  12:         string contentType = "image/jpeg";

13:

  14:         // Here we are calling the extension method and returning

  15:         // the ImageResult.

  16:         return this.Image(image, contentType);

  17:     }

  18: }

And we are done, and it was pretty easy. In just a few dozen lines of code, we have provided a way to return images from a controller action without the need to create a view. The result looks are shown below (and notice how we can user a meaningful URL, rather than something like "GetFile.aspx?filename=netLogo.jpg"):

We could do the same thing to return files from a database server by creating a FileResult class that is similar to ImageResult. In fact, the only difference needed is to change the content type to "application/octet-stream" and then the browser will prompt the user for where to save the file.

Autocompletion Textbox in MVC Using jQuery

Jeremiah.Clark — Thu, 13 Nov 2008 08:11:00 GMT

Ok, I have to admit it: jQuery is awesome. If you haven't started looking at it, I highly recommend that you do. It works wonders in the ASP.NET MVC world. One of the best things about jQuery is the enormous number of plug-ins that are available for adding even more functionality to the library.

The plug-in that I am going to be talking about in this post is jQuery Autocomplete.

So let's make a autocomplete text box in MVC for adding tags (or labels) for a blog post. First, we are going to need to put a text box in one of our views with the name "tags".

   1: <div>

   2:     <%= Html.TextBox("postTags")  %>

   3: </div>

Now, in the same view (or the master page) we need to add the references for jQuery Autocomplete. The plug-in also comes with a stylesheet for styling the drop-down that will contain the autocomplete options.

   1: <link href="/Content/jquery.autocomplete.css" rel="stylesheet" type="text/css" media="screen" />

   2: <script type="text/javascript" src="/Scripts/jquery-1.2.6.js"></script>

   3: <script type="text/javascript" src="/Scripts/jquery.autocomplete.js"></script>

Next, we need to create a controller action that will return the list of autocomplete values in the JSON format.

   1: [HandleError]

   2: public class UtilitiesController : Controller

   3: {

   4:     /// <summary>

   5:     /// This action method looks up the tags.

   6:     /// </summary>

   7:     /// <param name="q">The query that contains the user input.</param>

   8:     /// <param name="limit">The number of tags return.</param>

   9:     public ActionResult LookupTags(string q, int limit)

  10:     {

  11:         // We can get a list of tags from the database, but

  12:         // for this example, I will populate a list with values.

  13:         List<string> tags = new List<string>();

  14:         tags.Add("asp");

  15:         tags.Add("mvc");

  16:         tags.Add("microsoft");

  17:         tags.Add("sql server");

  18:         tags.Add("jQuery");

  19:         tags.Add("ajax");

20:

  21:         // Select the tags that match the query, and get the

  22:         // number or tags specified by the limit.

  23:         var retValue = tags

  24:             .Where(x => x.StartsWith(q))

  25:             .OrderBy(x => x)

  26:             .Take(limit)

  27:             .Select(r => new { Tag = r });

28:

  29:         // Return the result set as JSON

  30:         return Json(retValue);

  31:     }

  32: }

Finally, we have to add the jQuery Autocomplete initialization script in the view (or master page) to wire up the plug-in to the text box. Notice in line 4 that we are using a the action method that we created above to get the list of tags.

   1: <script type="text/javascript">

   2: $(document).ready(function()

   3: {

   4:     $("#postTags").autocomplete('<%=Url.Action("LookupTags", "Utilities") %>',

   5:     {

   6:         dataType: 'json',

   7:         parse: function(data)

   8:         {

   9:             var rows = new Array();

  10:             for (var i = 0; i < data.length; i++)

  11:             {

  12:                 rows[i] = { data: data[i], value: data[i].Tag, result: data[i].Tag };

  13:             }

  14:             return rows;

  15:         },

  16:         formatItem: function(row, i, max)

  17:         {

  18:             return row.Tag;

  19:         },

  20:         width: 300,

  21:         highlight: false,

  22:         multiple: true,

  23:         multipleSeparator: ","

  24:     });

  25: });

  26: </script>

The documentation for the plug-in details all of the various options that can be used in the autocomplete function.

Now we have an AJAX enabled autocomplete box using jQuery in ASP.NET MVC.

The power of jQuery never ceases to amaze me. There will likely be plenty more posts to come on the topic of using jQuery in MVC.

CheckBoxList Helper for MVC

Jeremiah.Clark — Tue, 11 Nov 2008 05:16:17 GMT

The early previews of the MVC Toolkit contained a few helpers that are not available in the current MVC Beta and MVC Beta Futures. On of the ones that was nixed was the CheckBoxList helper. I was in need of this type of functionality lately and found myself out of luck. I needed to add a dynamic list of checkboxes to a form, like the roles that a user could possible be a member of. These roles could be added to or deleted from at any time.

I looked to the Html.CheckBox helper to see if that would work. This helper can be used like so:

        1: /* The model for this is a Dictionary<string,bool> that contains 

       2:    the name for the role and whether the user is a member */

       3:  

       4: <% foreach (var info in ViewData.Model) { %>

       5:     <div><%= Html.CheckBox(info.Key, info.Value) %> <%= info.Key %></div>

       6: <% } %>

The problem with using Html.CheckBox for my scenario arises when you need to get the values in the form ActionMethod. For Html.CheckBox, the form handler is expecting a boolean parameter for each checkbox. An example is show below.

       1: [AcceptVerbs(HttpVerbs.Post)]

       2: public ActionResult Roles(bool administrator, bool user, bool poweruser)

       3: {

       4:     // Each bool parameter is the checked value for the checkbox that 

       5:     // has the same name.  If my list of roles is dynamic, this does

       6:     // not work so well :(

       7: }

As you can see, this would not satisfy the requirements that I had. So what is the answer? Create my own CheckBoxList helper of course.

Here is the extension method code for my implementation, along with a simple class that contains the info needed for each checkbox in the list..

   1: public static class InputExtensions

   2: {

   3:     public static string CheckBoxList(this HtmlHelper htmlHelper, string name, List<CheckBoxListInfo> listInfo)

   4:     {

   5:         return htmlHelper.CheckBoxList(name, listInfo,

   6:             ((IDictionary<string, object>) null));

   7:     }

8:

   9:     public static string CheckBoxList(this HtmlHelper htmlHelper, string name, List<CheckBoxListInfo> listInfo,

  10:         object htmlAttributes)

  11:     {

  12:         return htmlHelper.CheckBoxList(name, listInfo,

  13:             ((IDictionary<string, object>)new RouteValueDictionary(htmlAttributes)));

  14:     }

15:

  16:     public static string CheckBoxList(this HtmlHelper htmlHelper, string name, List<CheckBoxListInfo> listInfo,

  17:         IDictionary<string, object> htmlAttributes)

  18:     {

  19:         if (String.IsNullOrEmpty(name))

  20:             throw new ArgumentException("The argument must have a value", "name");

  21:         if (listInfo == null)

  22:             throw new ArgumentNullException("listInfo");

  23:         if (listInfo.Count < 1)

  24:             throw new ArgumentException("The list must contain at least one value", "listInfo");

25:

  26:         StringBuilder sb = new StringBuilder();

27:

  28:         foreach (CheckBoxListInfo info in listInfo)

  29:         {

  30:             TagBuilder builder = new TagBuilder("input");

  31:             if (info.IsChecked) builder.MergeAttribute("checked", "checked");

  32:             builder.MergeAttributes<string, object>(htmlAttributes);

  33:             builder.MergeAttribute("type", "checkbox");

  34:             builder.MergeAttribute("value", info.Value);

  35:             builder.MergeAttribute("name", name);

  36:             builder.InnerHtml = info.DisplayText;

  37:             sb.Append(builder.ToString(TagRenderMode.Normal));

  38:             sb.Append("<br />");

  39:         }

40:

  41:         return sb.ToString();

  42:     }

  43: }

44:

  45: // This the information that is needed by each checkbox in the

  46: // CheckBoxList helper.

  47: public class CheckBoxListInfo

  48: {

  49:     public CheckBoxListInfo(string value, string displayText, bool isChecked)

  50:     {

  51:         this.Value = value;

  52:         this.DisplayText = displayText;

  53:         this.IsChecked = isChecked;

  54:     }

55:

  56:     public string Value { get; private set; }

  57:     public string DisplayText { get; private set; }

  58:     public bool IsChecked { get; private set; }

  59: }

This can then be used to render the list of checkboxes in a View as shown below:

   1: /* Where ViewData.Model is a List of CheckBoxListInfo objects that

   2:    provide the details for the checkboxes. */

3:

   4: <div><%= Html.CheckBoxList("roles", ViewData.Model) %></div>

And now, in the post ActionMethod, we can access the ones that have been checked like so:

   1: [AcceptVerbs(HttpVerbs.Post)]

   2: public ActionResult Roles(string[] roles)

   3: {

   4:     /* The 'roles' parameter contains the values from the

   5:        checkboxes that were checked. */

   6: }

In addition to solving the issue that I was having, this post shows how easy it is to implement your own custom helpers in MVC.

IE8 Rocks! Slicing The Web

Jeremiah.Clark — Thu, 09 Oct 2008 07:23:48 GMT

A few days ago, I wrote a post about creating custom IE8 Accelerators. I thought that I would stick to the same IE8 theme and talk about another new feature that I really like: Web Slices.

Here is a brief introduction about what Web Slices are (taken directly from the IE8 site):

How many times a day do you check for updates to e-mail, weather reports, sports scores, stock quotes, auction items email and so on? Until now this was a manual process, where you had to go to those sites to check for changes or new information.

Using Web Slices, you can keep up with frequently updated sites directly from the Favorites Bar. If a Web Slice is available on a page, a green Web Slices icon will appear in the upper-right hand corner of the browser. You can then easily subscribe and add them to the Favorites Bar or delete Web Slices that are no longer desired.

When new information becomes available, the Web Slice will become highlighted. When you click on the Web Slice in the Favorites Bar, it previews relevant information. Clicking on the preview takes you directly to the site for more information.

"Web Slices", Internet Explorer 8: Faster and Easier, http://www.microsoft.com/windows/internet-explorer/beta/features/web-slices.aspx

So how do we Web Slice enable our own sites? Well, it is actually very simple. Let's pretend that the content in blue below contains something that we want to expose as a Web Slice for others to consume.

PI

3.1415926535...

The HTML for the above is simple:

   1: <div style="background-color: lightblue; color: black" id="content">

   2:   <h3>PI</h3>

   3:   <div>

   4:     <p>3.1415926535...</p>

   5:   </div>

   6: </div>

To make this content a Web Slice, you only need to add a few additional attributes to the HTML. Here is the updated HTML to turn this into a Web Slice that can be used in IE8:

   1: <div style="background-color: lightblue; color: black" id="content" class="hslice">

   2:   <h3 class="entry-title">PI</h3>

   3:   <div class="entry-content">

   4:     <p>3.1415926535...</p>

   5:   </div>

   6: </div>

As you can see, we have just added a few "class" attributes that specify the web slice, the title, and the content. The result looks exactly the same in the browser, but it enables the content to be consumed as a Web Slice. The content below is the Web Slice enabled version. If you are using IE8, you can add this as a Web Slice:

PI

3.1415926535...

You can tell that this is a web slice by hovering over the content. You will see a green icon that appears and then you can add this Web Slice to your browser as shown below:

After clicking "Add", the Web Slice will be added to the Favorites Bar in IE8 and then you can view the content at any time regardless of what pages you are browsing. This is shown below:

Of course, this example is not really that exciting. The real value in Web Slices is when you want to expose part of your site that is dynamic. Maybe you have a recent list of new products, or the current weather forecast, or your RSS feed. This is where Web Slices become really useful because a user can get just the information that they want from your site without having to browse to it each time. If the content in the example above was dynamic, the Web Slice would update periodically to reflect any new information. You can find some popular Web Slices on the Internet Explorer Gallery.

This post has just scratched the surface of what can be accomplished with Web Slices. The complete documentation is available on MSDN here. So play around with Web Slices and start exposing pieces of your site for all to consume!

IE8 Rocks! Creating Custom Accelerators

Jeremiah.Clark — Sun, 05 Oct 2008 02:16:15 GMT

Internet Explorer 8 Beta 2 is currently available. If you haven't downloaded it yet, you can find it here. I have been using it for about two months now and I am really enjoying some of the new features. One of the features that I find particularly interesting is Accelerators.

Here is a brief introduction about what Accelerators are (taken directly from the IE8 site):

Accelerators give you ready access to the online services you use everyday—from any page you visit. Now you can simply select some text and then click on the blue Accelerators icon. For example, you may be interested in the location of a business featured on a webpage. In the past, you would need to copy the address from the webpage, navigate to another the webpage for a mapping service, and paste in the address. With the "Map with Live Maps" Accelerator in Internet Explorer 8, you can get an in-place view of a map displayed directly on the page.

"Accelerators", Internet Explorer 8: Faster and Easier, http://www.microsoft.com/windows/internet-explorer/beta/features/accelerators.aspx

IE8 comes with a handful on pre-installed Accelerators as you can see from the menu above. There are also some more available here. You can also create your own custom accelerators quickly and easily. The documentation for creating accelerators can be found on the Accelerators Development Guide.

I decided to create a simple one to search the MSDN Library for the text that you have selected on a page in the IE8 browser. To create an accelerator, you just need to write an XML file that conforms to the OpenService Accelerator Schema and contains the information about the accelerator. Here is the XML file for my MSDN Search Accelerator:

   1: <?xml version="1.0" encoding="UTF-8" ?>

   2: <os:openServiceDescription xmlns:os="http://www.microsoft.com/schemas/openservicedescription/1.0">

   3:     <os:homepageUrl>http://social.msdn.microsoft.com/</os:homepageUrl>

   4:     <os:display>

   5:         <os:name>Search MSDN</os:name>

   6:         <os:icon>http://msdn.microsoft.com/favicon.ico</os:icon>

   7:         <os:description>Search the MSDN Documentation.</os:description>

   8:     </os:display>

   9:     <os:activity category="Search">

  10:         <os:activityAction context="selection">

  11:             <os:execute action="http://social.msdn.microsoft.com/Search/en-US/?query={selection}" method="get" />

  12:         </os:activityAction>

  13:     </os:activity>

  14: </os:openServiceDescription>

As you can see, you just provide some basic information about the accelerator and specify the action to take when the user invokes it. In the above example, we are just adding whatever text the user has selected to the URL for the MSDN Search site (line 11).

To install an accelerator, it has to be hosted somewhere on a web server. It cannot be installed from the hard drive. The code below shows a button that allows you to install an accelerator service:

   1: <button id="myButton"

   2:     onclick="window.external.AddService('http://www.softwareapproach.com/IE8accelerators/msdnaccelerator.xml')">

   3:     Add MSDN Search Accelerator to Internet Explorer 8</button>

Click the button below to install the MSDN Search Accelerator if you want to give it a try.

The MSDN Search Accelerator will now appear in your menu when you select some text on a web page in IE8. And upon clicking, it will open a new tab with the MSDN Search results for the selected text. The images below show the accelerator in the menu and the result of invoking the accelerator.

There are tons of uses for accelerators. The possibilities are endless. In addition to just linking to another web site, you could create a custom web service that users could submit information to via an accelerator for some sort of processing. I really like the way that IE8 was designed and the easy extensibility and customization that it provides to users. So give IE8 and accelerators a try! If you come up with some cool accelerator ideas, let me know. I am interested to see the ideas that people come up with.

Use PowerShell To Test Code Snippets

Jeremiah.Clark — Sat, 13 Sep 2008 06:59:30 GMT

If you are like me, then you might have multiple Console applications in your projects folder that you use for testing small chunks of code. I think at one point recently, I was up to ConsoleApplication28 before I cleaned up the unused projects. These are typically used for testing small snippets of code that I am planning to use in other projects that actually have meaningful names, but I just want to play with the small snippet rather than deal with running through the complete project to test my one or two line experiments.

Thankfully, I have recently started using PowerShell to experiment with snippets and this has proven to be much easier. I will run through a few common scenarios and show how to user PowerShell to test these snippets.

Testing Regex Expressions

How many times have you had to manipulate a Regex before getting it right? It can be very annoying if you have to keep rebuilding your project to test these match expressions. Well, here is a simple way to do this in PowerShell:

In PowerShell, we can use .NET Framework libraries just as we do in C#. The syntax is slightly different, but in this case we are just calling the Regex.Matches method. After executing the command, you can see the groups that were matched, as well as some of the other properties associated with calling the Matches method.

Testing DateTime Formatting

Another common experiment is to test the returns of DateTime formats. Here are a few examples of how to do this in PowerShell:

The above example shows a few common DateTime tasks that can be easily done in PowerShell.

Conclusion

There are a lot more really cool features of PowerShell that can really help when you need to test code samples. I will try to post some more about this in the near future. Until then, play around with PowerShell...it is a really powerful tool.