Validation on SharePoint Forms – Part One

There are many occasions where you might like to do some validation on NewForm.aspx and/or EditForm.aspx in SharePoint beyond the simple column by column validation which the form provides automagically.  For instance, if you have two dates, you might want to ensure that the second is after the first, or you may want the entry of a value in one column to change the available values in another.  The .NET folks out there will want to jump straight into Visual Studio, and there’s nothing wrong with that.  However, there are some nice options using SharePoint Designer (what I call the “Middle Tier”) as well.

One set of options doesn’t require any change to the List Form Web Part (LFWP) which is on the page by default.  Using JavaScript, you can hook into the events on the controls (onchange, onclick, etc.) to do some validation.  I started learning about this by reading the great post over at the Microsoft SharePoint Designer Team Blog entitled Using JavaScript to Manipulate a List Form Field.  In that post, they provide some nice JavaScript functions to get you started.  I soon found that I needed to do other things and started to add to and extend some of the functions found there.  I’ve now got a little toolkit of functions that I use to build from.

The second set of options entails converting the LFWP to a Data View Web Part (DVWP) and reconfiguring the controls themselves.  This is relatively easy, and lets you totally reconfigure the page to your heart’s content.  You sometimes can do this by clicking on the icon in the upper left of the LFWP and choosing Convert to XSLT Data View.  (There are plenty of posts out there on how to do this step – Live Search “Convert to XSLT Data View”.)

I’ve been participating in the MSDN/TechNet forums on SharePoint – Design and Customization a lot lately, and there is a lot of interest in these techniques, perhaps due to the fact that SharePoint Designer is now freely available.

In this series of posts, I’ll explain some of the approaches which I’ve used.  Next up: the date check example above.