Programming Without Walls

jQuery Linear Gradient Effect Plug-In Using CSS3 Background-Image Linear-Gradient Value

Sat, 27 Aug 2011 13:00:00 -0700

jQuery, along with jQuery UI provides developers with many effects options. Unfortunately, many of the newer, more complex CSS3 effects cannot be automatically animated using jQuery's built-in animation code. In this post I will show you how to use the step option jQuery's animate method to manipulate just about any property of an element, including any CSS3 property (specifically the linear-gradient value for the background-image property in this example).

CSS3 Linear Gradient

CSS3 introduced a number of new ways to style HTML markup. One of the more complex among them (syntactically) is the linear-gradient value added to the background-image property. The way you specify a linear gradient is as follows:

background-image: linear-gradient( [<point> || <angle>,]? <stop>, <stop> [, <stop>]* )

where:

<stop> <color> [ <percentage> | <length> ]

As you can see, it's kind of complicated so I won't explain the syntax, the w3c draft specification does a good job on its own. (It helps if you've ever used Photoshop to create gradients because it basically uses the same stop concept) Instead, I'll focus on how we can manipulate this syntax within a custom animation to create a custom jQuery effect.

jQuery Step Option

Utilizing the step property of the options of the second call method of jQuery's animate function, you can create custom animations of any type, not just the built-in CSS properties that jQuery knows about. There are many articles posted in many blogs about this, but I first read about it on Ben Nadel's blog. What the step option gives us is a function that jQuery will call for each step of the animation. Meaning that it will calculate the easing, timing, etc, and make this call to your function for each step, providing you with some key information (e.g. the now variable, which gives you the current calculated value of the custom CSS property you asked jQuery to animate; in our example, this property is called 'percent'). This means we can create virtually any animation one can think of.

Custom Animation

Given the step option, and the skeleton jQuery effect plug-in I wrote about last time, we can create an effect plug-in that will do the following:

Accept a times option to specify how many times the animation should run
A duration to specify how long it should run per time (in milliseconds)
A starting angle for the linear-gradient (this plug-in actually does require it to be a numeric angle and not the specification's permitted textual direction parameters).
A stops array, which itself can contain either a color only in each index, or a two-item array specifying the color and the position. Note that if the position is not specified in at least one of the stops, this effect won't animate anything, as it's the positions that the effect animates.

Given those requirements, here's the code:

/*!
* jQuery linear gradient effect plug-in.
* Requires jQuery UI.
* http://norimek.com/blog/page/jQuery-Plug-Ins.aspx
*
* Copyright 2011, Robert C. Barth
* Licensed under the MIT license.
* http://www.opensource.org/licenses/MIT
*
* Date: Sat Aug 27 13:00:00 2011 -0700
*/
(function($, undefined) {

$.effects.lineargradient = function(o) {

	return this.queue(function() {
		
		var $this = $(this), 
			props = [ 'background-image' ],
			times = o.options.times || 1,
			duration = o.duration || 1000,
			angle = o.options.angle || 0,
			stops = o.options.stops;
		
		$.effects.save($this, props);
		$this.css('percent', 0);
		
		for (var i = 0; i < times; i++) {
			
			$this.animate({ percent: 125 }, {
				queue: false,
				duration: duration,
				easing: o.options.easing,
				step: function(now, fx) {
					
					var gradientSpecifier = [ angle.toString() + 'deg, ' ]

					for (var ii = 0, l = stops.length; ii < l; ii++) {
						
						if ($.isArray(stops[ii])) {
							// Color
							gradientSpecifier.push(stops[ii][0].toString() + ' ');
							// Position
							gradientSpecifier.push(String(now + stops[ii][1]) + '%');
						} else {
							// Color only
							gradientSpecifier.push(stops[ii].toString());
						}
						
						if (ii < l - 1) {
							gradientSpecifier.push(', ');
						}
					}
					
					gradientSpecifier = gradientSpecifier.join('');
					
					$(fx.elem).css('background-image', '-webkit-linear-gradient(' + gradientSpecifier + ')');
					$(fx.elem).css('background-image', '-moz-linear-gradient(' + gradientSpecifier + ')');
					$(fx.elem).css('background-image', '-o-linear-gradient(' + gradientSpecifier + ')');
					$(fx.elem).css('background-image', 'linear-gradient(' + gradientSpecifier + ')');
				},
				complete: function() {
					
					$this.css('percent', 0);
					$.effects.restore($this, props);
					
					$this.dequeue();
					
					if (o.callback) {
						o.callback.apply(this, arguments);
					}
				}
			});
		}
	});
};
})(jQuery);

It's actually a pretty simple effect plug-in. It just sets up a custom CSS property iterator ('percent'), setting the value to get to to 125 (jQuery will animate from zero to that, and the completion function sets it back to zero), and on its way toward 125, will call the step function specified, which does the actual animating by creating a string that is the linear-gradient specifier, and setting the background-image CSS property of the specified element to that (since the linear-gradient value is not standardized yet, it sets the background-image property four different ways for Opera, Mozilla, Webkit, and finally the CSS3 standard).

Please note that the stop positions specified in the array are offsets (unlike the CSS value itself which takes positions as percents -- the animation code converts the offsets to percents during the animation). Meaning, if you were to create a gradient at 10%, 20%, 100%, the offsets to put into the array are something like -25, -15, 65. It is important to usually start at -25 or so because the animator goes to +25 so that larger gradients can "complete" (it makes more sense when you watch the gradients themselves animate -- the trailing part needs to disappear for it to look right).

Also note that this plug-in requires jQuery UI. Please reference the jQuery UI in your page when you use it or it won't work!

OK, enough talking already, the example is here. There are a couple of examples of what the plug-in can do, but you can certainly do more with it. The plug-in source code is available via the link below.

jquery.effects.lineargradient.js (1.80 kb)

Creating Custom Effects in jQuery

Fri, 26 Aug 2011 14:31:00 -0700

The other day I needed to create a custom effect in jQuery but I couldn’t find decent documentation on how to do it. I resorted to reading through the jQuery UI effects source code to figure it out, and while that’s fine, in case you’re looking to do the same thing (create a custom effect, not read through source code), I figured I’d write a post to at least speed up your development effort.

All of the effects follow the same basic layout: a self-contained function that extends the $.effects namespace with the name of the effect (e.g. $.effects.myEffect) as a function that takes a single parameter (‘o’, that contains all of the options the user of your effect passes in via the call, and some other information that jQuery stuffs in there).

Inside this function, you basically just return the result of doing this.queue(); (which takes a single parameter – a function). That call enqueues your effect into the jQuery animation queue. The code inside the queue call also follows the same basic structure: set up your effect properties, declare the CSS properties you want to set back to their original values (the jQuery UI infrastructure has a nice function pair [$.effect.save()/restore()] for saving and restoring CSS properties so that whatever element your effect was invoked on is returned to the visual state it was in before your effect was run), and then set up a loop to run your animation the number of times requested by the user of your effect. If the effect is the kind that you’d only run once (e.g. fade), you don’t need/want the loop. Regardless, you then call $.animate() to perform your custom animation, as necessary. A skeleton effect might look like this:

/** 
 * jQuery effect plug-in skeleton. 
 */ 
(function($, undefined) { 

$.effects.myEffect = function(o) { 

   return this.queue(function() { 

        var $this = $(this),  
            props = [ 'background-image' ], 
            times = o.options.times || 1, 
            duration = o.duration || 1000; 

        $this.css('percent', 0); 

        for (var i = 0; i < times; i++) { 
            // Call $this.animate() as necessary to perform animation for your effect. 
        } 
    }); 
}; 
})(jQuery);

This should be enough to get you started creating your own custom effects. One thing to note: in your last call to animate, you will want to make sure you set up a callback function, and in it, call $this.dequeue() or else your animation will never start, or else start the animation after the last animate call if your effect can’t be chained. That would also be where your restore the CSS properties you saved with $.effects.save() (line 15). For example (note: this is for a chained effect, you’ll want to animate with queue: false for this kind of effect, see the animate method’s documentation):

// Last animate call in the effect 
$this.animate({ /* Whatever */}, { 
    complete: function() { 

        $.effects.restore($this, props); 
        $this.dequeue(); 

        if (o.callback) { 
            o.callback.apply(this, arguments); 
        } 
    } 
});

In an upcoming post, I will show how I created two custom effects that jQuery’s animate() function doesn’t natively support (linear-gradient and box-shadow) using the step parameter in the animate method.

Setting Up .net 3.5 SP1 URL Routing In IIS 5.1/6.0 Without Wildcard Mapping

Mon, 16 Feb 2009 21:14:00 -0700

With the release of .net 3.5 SP1 came the release of the URL routing framework, which makes it extremely easy to be able to map user-friendly URL's to different things inside your application (notably, this functionality is required for MVC).

This all works fine in IIS 7, but if you're using IIS 5.1 on Windows XP Pro (like me) or IIS 6.0 on Vista, you're hosed. It simply will not work without a bit of hackery. The prevalent hackery involves using so-called wildcard mapping to map all file extensions to the asp.net ISAPI dll. This probably works in IIS 6.0 (I don't have it, so I'm guessing), but it certainly does not work in IIS 5.1 (you'll get a bunch of happy-fun-time 404 errors, or, at least, I did, and so did at least one other person on the Internet that I saw). Besides, who wants every file request (including css, html, png, jpg, etc.) to go through the asp.net ISAPI dll? From what I understand, that can reduce the speed of a request by up to 30%. Yuck!

A much better way to do it is to do what I recently did:

Set up a custom extension for your stuff. If you're using MVC, that extension is chosen for you (.mvc). For my purposes (a toned-down content management system), I chose ".content." Just go into the configuration for your application in the IIS Management Console and add your extension (as I mentioned, .content in my case).
Modify your RoutingTable Route rule to look for a static file with your extension (in my case, I chose content.content, so paths would look like: "content.content/{stuff}" with "stuff" being the parameter data the routing infrastructure would turn into a key/value pair for me.
Install your URL rewriting ISAPI filter. I used Ionic's ISAPI Rewrite Filter (IIRF). The thing you want to do here is rewrite URL's to your specific folder alluded to in step 2 (for me, /content/) to whatever you chose for your RoutingTable entry (in my case, content.content). So, what happens for me is, if a request for "/hostname/virtualfolder/content/stuff" is made, it rewrites the URL to "hostname/virtualfolder/content.content/stuff". This makes it so that the asp.net ISAPI dll will now handle the request (because of the .content "extension").

There, now you're done. Three simple steps. Depending on the URL rewriting ISAPI filter you choose, getting the rewriting to work might be a slight pain. For instance, IIRF uses regular expressions and I needed help figuring out the magic regular expression that would do the rewrite appropriately (I suck at creating regular expressions unless I spend a couple of weeks neck-deep in them, which is rare). Incidentally, RegExr is an awesome online Flash-based regular-expression testing tool and is what I use to test regular expression syntax. It helps because it not only shows you what will be captured in your sample text, it also shows you the capture groups and has all kinds of help describing what each character in your regular expression is doing.

I hope this saves someone some time.

10 Rules For Creating Decent Specifications Documents

Fri, 19 Dec 2008 17:13:00 -0700

It is an unfortunate state of our industry that I've worked on a large number of projects over the years but the quality of the specifications (if they existed at all) has been poor. Here are ten rules for creating decent specification documents, in no particular order. They all begin with the statement, "A decent specification is one that..."

1. Exists

If I had a dollar for every project I was on that contained zero written pages of specification, well, I'd be pretty poor, but the fact remains that a large percentage of projects simply have no written specification. Loads of reasons are given for this oversight (the requirements always change, there's no time for specifications, there's too much to document (!), etc.), but none of them outweigh the return on investment of actually knowing what you're writing.

2. Describes What, Not How

Many specifications have screenshots, pseudocode, and other things in them. These are all solutions to a problem. The specification should not describe how to fix the problem, just what the problem is. I will not pretend that this is an easy task, because it isn't. It's especially difficult for software engineers who (usually) will immediately try to figure out how to solve a problem. One can only describe the "what" of a problem after some experience.

3. Can Be Interpreted In As Few Ways As Possible

This one is vital. If the specification is ambiguous, it isn't really worthwhile. If software engineer A thinks it says one thing, QA tester B thinks it says another thing, and the customer thinks it says something else entirely, I can guarantee the solution will never solve the problem it was designed to in the first place.

4. Is Widely Distributed

Everyone on the team needs to have access to the specification. This includes QA staff, managers, and especially the customer (in addition to the engineering team and whoever is writing it). Without access, everyone will have their own idea of what the software is supposed to do.

5. Is Agreed Upon As Being The Spec By All Parties Involved

There can sometimes be competing interests in a project, especially if the project has broad appeal. Group A has its goals and group B has its, and the two may not be congruent. If everyone agrees that whatever is in the spec is the way the software will work when its done, you can avoid the incongruous goals of disparate groups (or, at least, force them to agree to some sort of compromise before any code is written).

6. Is Concise

Wordy explanations and jargon-filled specs only confuse people. Only say what is necessary to describe the problem, and no more. Use language the average person off-the-street who has no knowledge of your problem domain can understand so that new software engineers to the project can come up to speed quickly.

7. Is Consistent

If something is mentioned one way in one place, say it the same way everywhere. Or, better yet, refer the reader to the prior explanation. Inconsistincies in the spec will manifest themselves in engineering problems down the road.

8. Is Updated Regularly As Requirements Change

It's a fact of life in the software engineering world that the requirements are going to change. People change their minds. Customers are lost and gained. Those are the facts of life. What this means, however, is that someone is going to have to take on the job of maintaining the specification and time (and money) will have to be budgeted for that work in the project plan.

9. Describes As Much Of The Problem As Is Possible And Practical

Gather as much information as you can when writing the specification, but if you can't get any information about how a certain piece should work, leave it out. As long as it isn't a key piece of the overall problem, it probably won't affect anything and can be added later. On the flip-side, for things that are well-known, describe enough so that a software engineer can design a solution that will work.

10. Is Testable

Everything in the specification should be testable in some form. How else will you know if the solution provided solves the problem if it can't be tested? You won't and neither will the customer, and you'll be left to haggle over that last payment.

Call Business Object Methods From Client JavaScript

Sat, 07 Jun 2008 20:40:00 -0700

Using the techniques I will describe in this post you will be able to call just about any method on your business objects that your website project has a reference to, avoiding pass-through web service methods or static PageMethodAttribute'd methods on the aspx page.

History

If you've worked with ASP.net AJAX for any length of time you're probably called your fair share of webservices from client JavaScript or static methods on an aspx page via the PageMethods AJAX object and the PageMethodAttribute.

I was looking for a way to be able to call a method in my business objects directly from the client JavaScript, bypassing the pass-through methods. I knew this was possible because ASP.net AJAX does this itself. If I had to create all of these pass-through methods for the duration of my project, I was going to get very bored and there would be a lot of basically useless code that basically forwarded calls.

Revelation

I realized, after researching how AJAX makes its calls (via an HttpHandler), that I could put together a ScriptControl that implemented IHttpHandler that would broker calls to any other object that the web project had a reference to (via reflection). This means that I could set up a call on the client (in JavaScript) directly to a method on my business object on the server, without an intervening PageMethodAttribute'd static method on the aspx page or creating a web service.

Start

I called my control ClientBridge since it bridges the client and the business logic layer. Sometimes names are the hardest part of developing code, and I'm not convinced this name is all that great, but it'll work for now. Anyway, as I mentioned, this class is both a ScriptControl as well as an HttpHandler, so it must inherit from ScriptControl and IHttpHandler:

namespace Norimek.Web.UI.WebControls

{

    [ToolboxData("<{0}:ClientBridge runat=\"server\"></{0}:ClientBridge>")]

    public class ClientBridge : ScriptControl, IHttpHandler

Creating The HttpHandler

I'll start with the HttpHandler part of the code since it's short and more difficult. As I'm sure you know, the IHttpHandler interface has only one method: ProcessRequest. This is where you put the code to do whatever you need to do when your handler is called. The handler is called in response to whatever path you set up in your web.config for your handler. In the httpHandlers section of the web.config, you add your handler via the add tag:

<httpHandlers>

    <add verb="*" path="ClientBridge.axd" validate="false" type="Norimek.Web.UI.WebControls.ClientBridge, Norimek.Web.UI.WebControls" />

</httpHandlers>

We don't care what the path is, it just needs to be the same as what is called on the client JavaScript. This will be taken care of with code we add to the ScriptControl, so as long as those two match, the user of the control will not need to deal with this information.

In ProcessRequest what we need to do is take the parameters that are passed in via the HttpContext parameter (specifically, in the context.Request.InputStream property). These are parameters that are sent as part of the web method call, which is set up in the ScriptControl's JavaScript. The method takes three parameters: the name of the type to call, the name of the method to call, and a serialized parameters object, which is the parameters to the business object, which are parsed in ProcessRequest:

public void ProcessRequest(HttpContext context)

{

    const string Parameter_TypeName = "typeName";

    const string Parameter_MethodName = "methodName";

    const string Parameter_Parameters = "parameters";

  

    try

    {

        IDictionary<string, string> parameters = Common.DeserializeRequestParameters(context);

        

        if (string.IsNullOrEmpty(parameters[Parameter_TypeName]))

            throw new ArgumentNullException(Parameter_TypeName);

  

        if (string.IsNullOrEmpty(parameters[Parameter_MethodName]))

            throw new ArgumentNullException(Parameter_MethodName);

  

        string typeName = parameters[Parameter_TypeName];

        string methodName = parameters[Parameter_MethodName];

  

        Type objType;

  

        try

        {

            objType = Type.GetType(typeName, false);

        }

        catch (Exception e)

        {

            throw new Exception(string.Format("The typename specified '{0}' could not be loaded.", typeName), e);

        }

  

        object[] parameterList;

        Type[] typeList;

  

        CreateParameterList(parameters[Parameter_Parameters], out parameterList, out typeList);

  

        MethodInfo mi = objType.GetMethod(methodName, BindingFlags.Static | BindingFlags.Public | BindingFlags.NonPublic, null, typeList, null);

  

        if (mi == null)

            throw new Exception(string.Format("Could not find a method for type '{0}' with the name '{1}' and the parameters types '{2}'.", typeName, methodName, OutputArrayItems<Type>(typeList)));

  

        if (mi.GetCustomAttributes(typeof(WebMethodAttribute), false).Length == 0)

            throw new Exception(string.Format("Could not find a method for type '{0}' with the name '{1}' and the parameters types '{2}'.", typeName, methodName, OutputArrayItems<Type>(typeList)));

  

        ResponseObject response = new ResponseObject(mi.Invoke(null, parameterList));

  

        context.Response.ContentType = "application/json";

        context.Response.Cache.SetMaxAge(new TimeSpan(0));

  

        string responseString = new JavaScriptSerializer().Serialize(response);

  

        if (responseString != string.Empty)

            context.Response.Write(responseString);

    }

    catch (Exception e)

    {

        Common.WriteExceptionJsonString(context, e);

    }

  

}

Common.DeserializeRequestParameters is a helper function that does what it says and CreateParameterList is another helper function that deserializes the parameters parameter into an array of objects and types that are used in both GetMethod to find the specified method and in the method invocation to pass the parameter values.

Using these data (type to call, name of method, and parameters), the code uses reflection to load the specified type, find the specified method, and pass in the specified parameters.

Please note some design choices: the method it looks for can be public, private, or internal, but must be static and must be attributed with the WebMethodAttribute. This last constraint is a security consideration. The reason I added this constraint is because it makes it so that the client JavaScript can only call methods I want it to call. This constraint can easily be removed, if you like, but I suggest keeping it so that a malicious user cannot just make calls into your business objects all day long trying to find out what he or she can do.

Creating the Control

The reason I implemented a ScriptControl is because then all I have to do is drop this control on a page and I can make all the calls to my business objects I want. Creating a ScriptControl is not trivial, and the documentation is a bit sketchy.

ScriptControl

The two keys to implementing a ScriptControl is setting up the client properties of the client object (the object that will exist as a javascript object on the client) and creating the reference to the client JavaScript that will exist in a JavaScript file as an embedded resource file:

protected override IEnumerable<ScriptDescriptor> GetScriptDescriptors()

{

    ScriptControlDescriptor descriptor = new ScriptControlDescriptor("AFU.ClientBridge", this.ClientID);

  

    descriptor.AddProperty("timeout", this.Timeout);

    descriptor.AddProperty("userContext", this.UserContext);

    descriptor.AddProperty("succeededCallback", this.CallbackSucceededHandler);

    descriptor.AddProperty("failedCallback", this.CallbackFailedHandler);

    descriptor.AddProperty("url", Common.MakeUrl("ClientBridge.axd", this.Page.Request.Url));

  

    return new ScriptDescriptor[] { descriptor };

}

  

protected override IEnumerable<ScriptReference> GetScriptReferences()

{

    ScriptReference reference = new ScriptReference("Adot.Fast.Web.UI.WebControls.ClientBridge.js",

                "Adot.Fast.Web.UI.WebControls");

  

    return new ScriptReference[] { reference };

}

In GetScriptDescriptors, all of the descriptor.AddProperty calls are properties that exist on the JavaScript object. If they do not exist there, an error will occur upon loading the page on the client (note that the property names are case sensitive). As you can see, the url property is set here explicitly. As I mentioned earlier, the end-user need not worry about this parameter because it is set here by us once and for all. Whatever endpoint is here (in this case, ClientBridge.axd), it must match the line in the httpHandlers section, described earlier.

Client JavaScript

The two purposes of the JavaScript is to define the object and to call the IHttpHandler. Conveniently, the ScriptControl implementation and the IHttpHandler implementation are in the same class. The JavaScript is rather short:

//<![CDATA[

Type.registerNamespace("Norimek.Web.UI");

  

Norimek.Web.UI.ClientBridge = function(element)

{

    Norimek.Web.UI.ClientBridge.initializeBase(this, [element]);

    

    this._timeout = 0;

    this._userContext = null;

    this._succeededCallback = null;

    this._failedCallback = null;

    this._url;

}

  

Norimek.Web.UI.ClientBridge.prototype = 

{

    get_timeout: function() { return this._timeout; },

    get_userContext: function() { return this._userContext; },

    get_succeededCallback: function() { return this._succeeededCallback; },

    get_failedCallback: function() { return this._failedCallback; },

    get_url: function() { return this._url; },

    

    set_timeout: function(value) { this._timeout = value; },

    set_userContext: function(value) { this._userContext = value; },

    set_succeededCallback: function(value) { this._succeededCallback = value; },

    set_failedCallback: function(value) { this._failedCallback = value; },

    set_url: function(value) { this._url = value; },

    

    invoke : function(typeName, methodName, parameters, succeededCallback, failedCallback, userContext, timeout)

    {

        return Sys.Net.WebServiceProxy.invoke(this._url, "invoke", false, { "typeName" : typeName, 

                    "methodName" : methodName, "parameters": parameters }, 

                    succeededCallback == null ? eval(this._succeededCallback) : succeededCallback, 

                    failedCallback == null ? eval(this._failedCallback) : failedCallback, 

                    userContext == null ? this._userContext : userContext, 

                    timeout == null ? this._timeout : timeout);

    }

}

Norimek.Web.UI.ClientBridge.registerClass("Norimek.Web.UI.ClientBridge", Sys.UI.Control);

//]]>

All there is are the property set and get accessors and the call to the Sys.Net.WebServiceProxy.invoke method. Since the url is "hard-coded" to the value set up in the ScriptControl.GetScriptDescriptors, the end-user does not need to know what it is. Note that this file must be marked as an "Embedded Resource" in the build action (right-click the file in the Solution Explorer and select Properties).

Use

To use the control, add a reference to the dll to your web project, add a register tag to the page for the control's library, and then drop the control on your page. Once the control is on your page you can call the invoke method of the control to call just about any type's method that your web project has a reference to:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="default.aspx.cs" Inherits="ClientBridgeTest._Default" %>

<%@ register assembly="Norimek.Web.UI.WebControls" namespace="Norimek.Web.UI.WebControls" tagprefix="nor" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >

<head runat="server">

    <title>ClientBridge Test</title>

</head>

<body>

  

    <form runat="server" id="frmMain">

    

        <script type="text/javascript">

        

        function test1()

        {

            $find("<%=ncbMain.ClientID %>").invoke("Norimek.BusinessInterface.System1, Norimek.BusinessInterface", "TestMethod1", "{ 'value1': 'System.Int32,10' }", onCallbackSucceeded);

        }

        

        function test2()

        {

            $find("<%=ncbMain.ClientID %>").invoke("Norimek.BusinessInterface.System1, Norimek.BusinessInterface", "TestMethod2", "{ 'value1': 'String,Value from parameter', 'value2': { 'value1': [1, 2, 3], 'value2': 5 }, 'value3': 'Int32,8' }", onCallbackSucceeded);

        }

        

        function onCallbackSucceeded(result, userContext, methodName)

        {

            alert(String.format("Response from method '{0}': '{1}'.", methodName, result));

        }

        </script>

  

        <asp:ScriptManager runat="server" ID="scrMain" EnablePageMethods="true" EnablePartialRendering="true" />

  

        <nor:ClientBridge runat="server" id="ncbMain" />

        

        <button type="button" onclick="test1();">Test 1</button>

        <button type="button" onclick="test2();">Test 2</button>

  

    </form>

  

</body>

</html>

Note: there must be an AJAX ScriptManager control on the page for the ClientBridge control to work; it uses the AJAX library's infrastructure to define itself.

The first test (test1) shows a call to a simple method that takes a single integer value and returns a single integer value. The second test (test2) shows how you can pass strings and arrays into the server method. Not shown, but also possible, is the ability to return arrays and complex objects from the server method. Note that the format of the parameters is a JSON string. The type of a parameter is specified as the value in the form, "type,value". Type can be either a fully-specified type (e.g. System.Int32) or just Int32. The type of the parameter is important so that the reflection code can find the the method signature.

Solution Example

In the example (linked below), there are three projects: Norimek.Web.UI.WebControls, Norimek.Web.ClientBridgeTest, and Norimek.BusinessInterface. The first contains the code for the control. The second is a web project used to test the control. In this project you can see how to set up the calls in JavaScript. The third is a sample business interface layer library with a couple of test methods that are called from the web project's default.aspx via JavaScript associated with the buttons on the page. With this project you can see how to handle the parameters that are passed in to the method.

ClientBridge.zip (76.62 kb)

Implementing OptGroup In A DropDownList Control

Fri, 06 Jun 2008 20:32:00 -0700

As I promised in the previous post, I will detail how to implement the HTML <optgroup> tag inside a <select> tag in this post. The HTML markup looks as follows when using the optgroup tag:

<select>

    <optgroup label="Group 1">

        <option>Item 1</option>

        <option>Item 2</option>

        <option>Item 3</option>

    </optgroup>

    <optgroup label="Group 2">

        <option>Item 4</option>

        <option>Item 5</option>

        <option>Item 6</option>

        <option>Item 7</option>

</optgroup>

That code would render something like the following:

As you can see, the optgroup tags render as bold and italicized group labels (that cannot be selected), and the items under each are indented. Note that in IE the optgroup tags cannot be styled but FireFox does permit styling.

As we know, the select tag is implemented in .net as the DropDownList control. At render time, the control renders <option> tags from its Items collection. At first glance, it would seem like all one has to do to subclass the control and add an OptionGroups collection property which is a collection of ListItems (the type of the standard Items property). While this is part of what needs to be done, it is only the beginning.

Adding Option Groups

To start off, obviously we must create a class that inherits from DropDownList. I called this control OptionGroupDropDownList. Next, we need to add something to hold the optgroup tags. I added an OptionGroups property to the control:

public OptionGroupCollection OptionGroups

{

    get

    {

        if (_optionGroups == null)

        {

            _optionGroups = new OptionGroupCollection();

            if (_isTrackingViewState)

                _optionGroups.TrackViewState();

        }

 

        return _optionGroups;

    }

}

As you can see, the OptionGroups property is of type OptionGroupCollection. Two helper classes are required to implement this control: the aforementioned OptionGroupCollection and OptionGroup. Additionally, some state management things are going on in the property get accessor (there's no need for a set accessor). The state management is the thing that complicates this control beyond a simple subclass and render override that the UnEncodedDropDownList was. You'll see why we need to manage state in a moment.

OptionGroupCollection And OptionGroup Classes

To make things easy, OptionGroupCollection is simply a wrapper around a List<OptionGroup> private member. The OptionGroup is a couple of properties necessary to implement the optgroup tag and a wrapper for a ListItemCollection, which is a collection of the ListItems (option tags) that will render inside the optgroup tag. This is where the state management comes in. To make it easy for the user I wanted the items inside each OptionGroup to look and behave the same as the items in a normal DropDownList so I used the same class the built-in control uses: ListItemCollection. However, because ListItemCollection (and the ListItem child objects) are sealed, it is somewhat more cumbersome to manage the state of items in this collection than it would be otherwise. Luckily, ListItemCollection implements the IStateManager interface, which we will use to tell it when to manage its own state and obtain a state object.

State Management

To correctly manage state, the OptionGroupDropDownList control must manually manage its own state by overriding all of the IStateManager methods of the base DropDownList control, most important among them being TrackViewState:

protected override void TrackViewState()

{

    base.TrackViewState();

    this.OptionGroups.TrackViewState();

    _isTrackingViewState = true;

}

TrackingViewState signals the control (and any child controls that also need to know via manual forwarding) to start tracking viewstate. Without this signal, the ListItemCollection would never save its state between server round-trips. OptionGroupCollection and OptionGroup both implement IStateManager and therefore TrackViewState.

Two other important methods to override in the OptionGroupDropDownList (with regard to state management) are SaveViewState and LoadViewState. This is because the OptionGroupsCollection's state needs to be saved and loaded (which, in turn, saves the OptionGroup's, which in turn saves the ListItemCollection's state, which in turn saves the individual ListItem's state - it's just a chain and each individual object is responsible for saving its own state as an object and returning that object in SaveViewState). This is what these two method overrides look like:

protected override object SaveViewState()

{

    return new Pair(base.SaveViewState(), _optionGroups.SaveViewState());

}

 

protected override void LoadViewState(object savedState)

{

    Pair viewState = (Pair)savedState;

 

    base.LoadViewState(viewState.First);

    this.OptionGroups.LoadViewState(viewState.Second);

}

Rendering

The last important method to override is the RenderContents method which actually renders out our new OptionGroup items. This method is not very complicated and simply iterates the OptionGroups and OptionGroup.Items:

protected override void RenderContents(System.Web.UI.HtmlTextWriter writer)

{

    if (this.OptionGroups.Count > 0)

        foreach (OptionGroup optionGroup in this.OptionGroups)

        {

            writer.AddAttribute("label", optionGroup.LabelText);

            optionGroup.LabelStyle.AddAttributesToRender(writer);

            writer.RenderBeginTag("optgroup");

 

            foreach (ListItem item in optionGroup.Items)

            {

                if (item.Enabled)

                {

                    if (item.Selected)

                        writer.AddAttribute(HtmlTextWriterAttribute.Selected, "selected");

 

                    writer.AddAttribute(HtmlTextWriterAttribute.Value, item.Value);

 

                    if (item.Attributes != null && item.Attributes.Count > 0)

                        item.Attributes.Render(writer);

 

                    if (this.Page != null)

                        this.Page.ClientScript.RegisterForEventValidation(this.UniqueID, item.Value);

 

                    writer.RenderBeginTag("option");

                    writer.Write(item.Text);

                    writer.RenderEndTag();

                }

            }

 

            writer.RenderEndTag();

        }

    else

        base.RenderContents(writer);

}

Use

To use the control simply add OptionGroups and items to the OptionGroups you create:

OptionGroupDropDownList ogdMain = new OptionGroupDropDownList();

 

OptionGroup group = ogdMain.OptionGroups.Add("Group 1");

group.Items.Add("Item 1");

group.Items.Add("Item 2");

group.Items.Add("Item 3");

 

group = ogdMain.OptionGroups.Add("Group 2");

group.Items.Add("Item 4");

group.Items.Add("Item 5");

group.Items.Add("Item 6");

group.Items.Add("Item 7");

 

Page.Controls.Add(ogdMain);

Of course, you can declare the control on the aspx page; I have created it here programmatically just so the code runs if you copy and paste.

This control works just fine inside an AJAX UpdatePanel, in case you're wondering. There are some other incidentals with dealing with post data, which you can check out in the code, linked below.

Conclusion/Caveats

This was an interesting control to implement as I had to do a bunch of spelunking using Reflector to figure out how ListItemCollection saves state. It permits me to use the optgroup tag in a select tag, which is not exactly a requirement very often, but it's one of those things that when you need it, you need it.

Of course there are caveats: The default Items collection is not rendered in any way. I didn't need both at the same time so I didn't implement it. You can, however, change the code however you like. You'll want to mess about in the RenderContents method. Additionally, not a whole lot of testing has been done. I know, as I stated above, that this control works with an AJAX postback just perfectly, however, I'm not exactly sure how it works with regular postbacks. Most likely it works fine since the AJAX scenario is more complicated, but I make no guarantees.

OptionGroupDropDownList.cs (7.29 kb)

Displaying Hierarchies In A DropDownList Control

Thu, 22 May 2008 10:01:00 -0700

A lot of software has hierarchies in it. Anything having to do with classifications, ordering, or reporting structures usually has some kind of hierarchy involved. Many times, a tree control is an easy and convenient way to show the hierarchy. It has nice little plus and minus signs as well as little tree "branch" lines linking the parent elements to the child elements.

However, sometimes a tree control is overkill. For instance, if you are adding functionality to permit the user to search through some records via a field that is a hierarchy, you don't really need to show a whole tree control. A drop-down list with indented items would most likely fit the bill, especially if the hierarchy doesn't have too many items.

Filling a drop-down list with hierarchical items is rather trivial when you think about it. As long as you know the hierarchy level of an item, and the items are given to you in order of the hierarchy, you can simply indent by the hierarchy level (e.g. if you have an element that is a first order ancestor of the root, indent by one space, two order ancestor, indent by two spaces, etc.).

To make this work, since user agents (browsers) automatically distill extra space in HTML (as they should, according to the HTML spec), you need to use the HTML character entity   to add your extra spaces. In .net, however, there is a problem: the DropDownList control does not render HTML character entities in the ListItem text property. The implementation for the ListControl's RenderContents method (DropDownList is derived from ListControl) uses the HttpUtility class's HtmlEncode method when writing out the ListItem's text. This makes any attempt at adding an HTML character entity futile. What's a developer to do? Well, you can derive a new control from DropDownList and override the RenderContents method yourself:

using System;

using System.Web.UI.WebControls;

  

namespace Norimek.Web.UI.WebControls

{

    public class UnEncodedDropDownList : DropDownList

    {

  

        protected override void RenderContents(System.Web.UI.HtmlTextWriter writer)

        {

            ListItemCollection items = this.Items;

  

            for (int i = 0; i < items.Count; i++)

            {

                ListItem item = items[i];

  

                if (item.Enabled)

                {

                    writer.WriteBeginTag("option");

  

                    if (item.Selected)

                        writer.WriteAttribute("selected", "selected");

  

                    writer.WriteAttribute("value", item.Value, false);

  

                    if (item.Attributes != null && item.Attributes.Count > 0)

                        item.Attributes.Render(writer);

  

                    if (this.Page != null)

                        this.Page.ClientScript.RegisterForEventValidation(this.UniqueID, item.Value);

  

                    writer.Write('>');

  

                    writer.Write(item.Text);

  

                    writer.WriteEndTag("option");

                    writer.WriteLine();

                }

            }

        }

    }

}

The important part is line 34. Where it previously was HttpUtility.HtmlEncode(item.Text, writer), it is now just plain writer.Write(item.Text). Just use this control in place of a regular DropDownList control anytime you need to display a hierarchical list (or need to use HTML character entities in drop-down). I leave the creation of the controls item collection as an exercise for the reader since it will be highly-individualized. Suffice it to say it will very likely involve a small recursive function.

Of course you know, with great power comes great responsibility. Microsoft encoded that value for a reason. A lot of the time that text value is something the user entered. A malicious user could enter all sorts of crazy stuff into whatever data is later displayed on the page via this new control and wreak havoc with your application. It is your responsibility to make sure that the data that is in that text property is not something that will harm your user or the website, or anything else for that matter.

Next time I will show you how to implement a derived DropDownList that gives you the ability to use the <optgroup> tag inside of it so you can group your option items. Not terribly important, but very convenient when needed. And, surprisingly, a little bit more complicated than it seems it would be when you first look at it.

Query a Single Field for Multiple Values in a Stored Procedure

Wed, 30 Apr 2008 18:06:00 -0700

Every once-in-a-while it would just be convenient to query a single field for multiple values. For example, you want to select from your database the people who live in the states of Arizona, New Mexico, and California. That's no big deal, just do an IN, right? Sure, that works fine, if you know in advance what states you want to look for; but what if you don't? What if a user of your application can pick any number of any of the fifty states to search for?

I guess one could assign a bit value to each state, sum the bit values of the selected states, and then do some bit-wise arithmetic in the SELECT, but what if your list is of more than fifty items? Or the list is of user-defined items that you can't assign a bit value to beforehand? Well, then you can use the method I have outlined here.

To get this to work, you create a delimited string of ID's and pass that into the stored procedure and do a like operation on it in the WHERE clause:

where

    @stateIDString like '%|' CAST(StateID as varchar(max)) + '|%'

This will allow SQL Server to compare the ID's in the table to the delimited string. You can have as many ID's in the string as you need. As you can tell from the example, the string is delimited by pipes ('|') and must both start and end with the pipe (e.g. '|1|34|67|9|'). You do not need to delimit the string with a pipe. As long as you're comparing against a number, it can be anything other than a number.

As you can expect, there are drawbacks to this method. It is not fast. Searching a table with 500,000 rows took about four seconds, and searching a table with one million rows took about nine seconds. I was able to reduce the time by about half by adding a column to the table that was a pre-delimited version of the ID field (e.g. it contained '%|23|%' if the ID was 23). In this case, the like would just contain the name of the field. This field would be easy to set once during the insert operation via the business object, the stored procedure doing the insert, or even a trigger.

I can't take credit for this tip (although the aforementioned optimization is my own idea). A guy that likes to go by the name Homer Sapien introduced this technique to me a while ago. If you happen to know who he is, good for you. If not, your loss. :-)

Dynamic Sort Parameters in MS SQL Server 2005

Tue, 29 Apr 2008 19:04:00 -0700

I prefer to have the parts of a software system that are good at particular tasks to do those tasks. Case in point: sorting. SQL Server (with proper indexes) is very good at sorting data, so I make sure that most, if not all of the sorting of data in my applications occurs in stored procedures in SQL Server.

This can cause a bit of a problem, however, if you're developing an application that permits the user to sort by different columns. One solution would be to write as many different stored procedures as you have sort criteria. Maintenance would be a nightmare on that so I don't think it's a good idea. Another way would be to parameterize the sort criteria into either a string or magic numbers and use a case statement in the ORDER BY clause to figure out what to sort by. That is the method I often use, and it looks like this:

order by

    case 

    when @sortExpression = 'lastname asc' then CAST(LastName as sql_variant)

    when @sortExpression = 'firstname asc' then CAST(FirstName as sql_variant)

    end asc,

    case

    when @sortExpression = 'lastname desc' then CAST(LastName as sql_variant)

    when @sortExpression = 'firstname desc' then CAST(FirstName as sql_variant)

    end desc

In this example, imagine we are sorting a table with a person's first and last names as fields named (conveniently) FirstName and LastName. The first part permits sorting in ascending order and the second part permits sorting in descending order. The @sortExpression takes the form that .net data controls serve up. It is important to CAST the field names as sql_variant type. In this example, it doesn't really matter, however, if the data types of the columns that are returned from the case statement are different (e.g. an NVARCHAR and a DATETIME), SQL Server will complain because it can't figure out what data type you're trying to return (it will choose the data type of the first element in the CASE statement, and anything that isn't that type or can be implicitly converted to that type, will cause it to have an error at run-time).

Okay, so this solves the immediate problem of being able to sort by parameter, but what if we want to sort by multiple fields? For example, when the user sorts by LastName (as in the example above), shouldn't the software also sort by FirstName as a secondary sort field? Of course it should. Here's how you do that:

order by

    case 

    when @sortExpression = 'lastname asc' then CAST(LastName as sql_variant)

    when @sortExpression = 'firstname asc' then CAST(FirstName as sql_variant)

    end asc,

    case when @sortExpression = 'lastname asc' then CAST(FirstName as sql_variant) end asc,

    case when @sortExpression = 'firstname asc' then CAST(LastName) as sql_variant) end asc,

    case

    when @sortExpression = 'lastname desc' then CAST(LastName as sql_variant)

    when @sortExpression = 'firstname desc' then CAST(FirstName as sql_variant)

    end desc,

    case when @sortExpression = 'lastname desc' then CAST(FirstName as sql_variant) end desc,

    case when @sortExpression = 'firstname desc' then CAST(LastName as sql_variant) end desc

Notice lines 6, 7, 12, and 13. These lines inject another field into the order by clause after the first case statement has already returned the primary field. They are whole CASE statements all on their own. You can continue to add fields to the sort list in this way until your hands get tired. In this example, I'm sorting by FirstName as a secondary field when the user selects the LastName field to sort by (and vice-versa); you, however, can make it do whatever you want. For example, you might permit the user to sort by HireDTm (representing the date this person was hired), and then by LastName and FirstName using the technique above. If you happen to also need the ability to page the returned data, this method also works perfectly with the ROW_NUMBER() OVER() syntax also introduced in SQL Server 2005. Just put the order by information in the OVER() part.

Of course, nothing is perfect and there are a couple of problems with this method. The first (which I consider minor) is that the user cannot select the secondary (and further) sort fields. I suppose if you really wanted to, you could change the @sortExpression parameter to be something other than what I have above and instead pass in a value that indicates which of a matrix of combinations of sort fields the user has selected, and then write the WHEN parts of the CASE statement for every combination the user could choose. While that would probably work, I'm thinking it's overkill (and a lot of work). You can usually get away with a couple of static secondary field choices, as long as you spend a couple of moments thinking about how the data is used by the user.

The second problem is that this method is not very speedy. In a table with 500,000 rows, it will return in about two seconds (my test table had six columns, one primary key integer IDENTITY column, and five data columns, which were NVARCHAR(50), NVARCHAR(100), INT, INT, and NUMERIC(14, 4)). In a table with over three million rows (3.2 to be exact), it took between 18 and 22 seconds. I didn't do enough tests to see if the speed degradation is linear or geometric, but it's not good, nonetheless. If you use this method, use it on smallish tables.

Calculating Work Days

Thu, 24 Apr 2008 19:35:00 -0700

A couple of weeks ago a client of mine asked for a feature in which the software could display the number of days a piece of work was overdue. That's not a problem. Naturally, however, they wanted it to be work days. I didn't want to explain how computers are unbelievably bad at messing with dates so I just said "sure."

The other day I came to the part in the project where I had to implement this feature. Figuring someone, somewhere had figured out how to do this (and published it in a blog or something), I perused Google. Unfortunately, the solutions I found either involved using the Microsoft.VisualBasic assembly and the DateDiff function (which don't work*) or writing a row to a database table for every day in the year, with various shenanigans to determine whether the day is a work day or not, running the gamut from computed columns (which I actually liked) to indexing the entire year by number, skipping non-work days.

I really did not want to create a solution in which my client would need to tediously create a new calendar for every day of the year, every year. I'm sure I could have written a nice UI and everything but I didn't want to waste the time or money. Instead, I figured I could write an algorithm that figures out weekends mathematically. The result follows. It took me about three hours before I had something that worked and I don't guarantee this works for every two valid date combinations, but it passed the 27 tests I could think of.

/// <summary>

/// Calculates the whole number of work days between two arbitrary dates.

/// </summary>

/// <param name="startDate">The first date of the range to check.</param>

/// <param name="endDate">The second date of the range to check.</param>

/// <param name="nonWorkDays">An array of DateTime values indicating non-work days. Note: This

/// array cannot contain days that occur on weekends.</param>

/// <returns>The count of whole work days that occur between startDate and endDate, inclusive.</returns>

public static int CalculateWorkdaysCount(

            DateTime startDate,

            DateTime endDate,

            DateTime[] nonWorkDays)

{

    // Zero the time

    DateTime sdt = startDate.Subtract(startDate.TimeOfDay);

    DateTime edt = endDate.Subtract(endDate.TimeOfDay);

  

    if (sdt > edt)

        return 0;

  

    // Get an initial workdays count

    int workDays = (int)edt.Subtract(sdt).TotalDays + 1;

    int weeks = workDays / 7;

  

    // Subtract the weekends indicated by the number of whole weeks the dates span

    workDays -= weeks * 2;

    // Remove the whole weeks from the span and figure out what is left

    edt = edt.AddDays(-weeks * 7);

  

    // Subtracting the whole weeks leaves us with a partial week. If the date span is a

    // a multiple of seven, edt will be == sdt and need not be checked. At this point,

    // anything over a week looks the same as if the date span were less than a week, originally.

    if (edt > sdt)

    {

        // If the start and end dates span a weekend, decrement the work day count by two

        if (sdt.DayOfWeek > edt.DayOfWeek && edt.DayOfWeek < DayOfWeek.Saturday && edt.DayOfWeek > DayOfWeek.Sunday)

            workDays -= 2;

        else

        {

            // If the start date is a Saturday or Sunday, decrement the work day count

            if (sdt.DayOfWeek == DayOfWeek.Saturday || sdt.DayOfWeek == DayOfWeek.Sunday)

                workDays--;

  

            // If the end date is a Saturdayor Sunday, decrement the work day count

            if (edt.DayOfWeek == DayOfWeek.Saturday || edt.DayOfWeek == DayOfWeek.Sunday)

                workDays--;

        }

    }

  

    // Remove the non-work days from the count if they are between the (original) startDate and endDate.

    // Note: the times of the non-work days are zeroed.

    // This implies that a nonWorkDay cannot be a weekend due to the calculations, above.

    if (nonWorkDays != null)

        foreach (DateTime nonWorkDay in nonWorkDays)

            if (nonWorkDay.Subtract(nonWorkDay.TimeOfDay) >= startDate && nonWorkDay.Subtract(nonWorkDay.TimeOfDay) <= endDate)

                workDays--;

  

    return workDays;

}

I also created a version as an MS SQL Server function so that data I pull out of the database can have counts in them and, more importantly, I can use the calculation in a WHERE clause.

set ANSI_NULLS ON

set QUOTED_IDENTIFIER ON

go

  

ALTER FUNCTION [dbo].[CalculateWorkdaysCount]

(

    @refCalendarTypeID int = null,

    @startDate datetime,

    @endDate datetime

)

RETURNS int

AS

BEGIN

  

    -- Note: If @@DATEFIRST != 7, this function won't work

  

    declare @sdt datetime

    declare @edt datetime

  

    if (@startDate is null or @endDate is null)

        return 0

  

    set @sdt = CAST(CAST(MONTH(@startDate) as varchar) + '/' + CAST(DAY(@startDate) as varchar) + '/' + CAST(YEAR(@startDate) as varchar) as datetime)

    set @edt = CAST(CAST(MONTH(@endDate) as varchar) + '/' + CAST(DAY(@endDate) as varchar) + '/' + CAST(YEAR(@endDate) as varchar) as datetime)

  

    if (@sdt > @edt)

        return 0

  

    declare @workDays int

    declare @weeks int

  

    set @workDays = DATEDIFF(day, @sdt, @edt) + 1

    set @weeks = @workDays / 7

    set @workDays = @workDays - (@weeks * 2)

    set @edt = DATEADD(day, -@weeks * 7, @edt)

  

    if @edt > @sdt

  

    begin

  

        declare @sdtWeekday int

        declare @edtWeekday int

  

        set @sdtWeekday = DATEPART(weekday, @sdt)

        set @edtWeekday = DATEPART(weekday, @edt)

        

        if (@sdtWeekDay > @edtWeekDay and @edtWeekDay < 7 and @edtWeekDay > 1)

            set @workDays = @workDays - 2

        else

  

        begin

  

            if (@sdtWeekday = 7 or @sdtWeekDay = 1)

                set @workDays = @workDays - 1

  

            if (@edtWeekDay = 7 or @edtWeekDay = 1)

                set @workDays = @workDays - 1

  

        end

  

    end

  

    if @refCalendarTypeID is not null

  

    begin

  

        declare @nonWorkDayCount int

  

        select

            @nonWorkDayCount = COUNT(*)

        from

            Calendars c

        where

            c.RefCalendarTypeID = @refCalendarTypeID

            and c.NonWorkDayDate between @startDate and @endDate

  

        set @workDays = @workDays - @nonWorkDayCount

  

    end

  

    return @workDays

  

END

How It Works

The function takes a start date, end date, and an array of non-work days. The non-work days parameter can be NULL. The function first figures out the number of days between the two dates. Then, it figures out the number of full weeks between the two days and subtracts out 2 * the number of weeks from the previously calculated total days. It then subtracts the number of days in the full weeks from the end date, which will leave us with the partial week that is at either the beginning or end of the range. Then a little checking is done to see if this period spans a weekend and starts or ends on a weekend day, and depending on what it figures out, the appropriate amount is subtracted from the running total. Lastly, it runs through the non-working days checking if any occur between the start and end dates, and subtracts those that do from the running count.

The T-SQL function expects there to be a table named Calendars with two fields: RefCalendarTypeID (int) and NonWorkDayDate (smalldatetime). This is because you can't exactly pass in an array of non-work days like you can in the C# function. Just add your non-work days (e.g. holidays) to the Calendars table, and the function will calculate the number of work days between two valid dates. If you don't need that functionality, you can take out that portion at the end of the function. You'll notice the function also takes a parameter @refCalendarTypeID. This corresponds to the RefCalendarTypeID field in the Calendars table and enables you to have more than one calendar of non-work days.

Caveats

There are a few caveats that you need to be aware of. If you define a non-work day in the non-work days array (or table in the T-SQL function, below) that falls on a weekend it will be counted twice. Also, if you're working on a project or in an area where weekends are work days (or either of Saturday or Sunday) this function won't work, but you can of course tweak it to do what you want. One last thing: in the T-SQL function, as the comment states, @@DATEFIRST must be equal to 7 or it won't work (see SET DATEFIRST in the SQL Server BOL).

Conclusion

I like this method better than the numerous methods involving filling a database table with each day of the year because the maintenance is reduced. It will degrade nicely if there are no non-work days defined and it doesn't cause the calendar table to be filled with almost 2,000 rows after five years in production (not that 2,000 rows is a lot, but if we use 10 holidays per year as non-work days, that's only 50 rows with this implementation).

* If you use Reflector to check out the DateDiff function, you'll see that all it does is divide the total days between the two dates by seven and return that as a long when you pass in a DateInterval of Weekday. I dont think I have to say that this won't work for our purposes (frankly, I'm at a loss for a situation in which this would work).