Monday, December 1, 2008

Adding validation to a custom list control in Sharepoint

Introduction

Recently one of the requirements was to put validation to a custom list controls such as Email field validation.
This validation can be achieved from inside the sharepoint designer.
Following is a step by step walk through to validate a list field

Background

You should know how to create a Sharepoint list and how to open the site in Sharepoint designer.


  1. Following is a list with Email fields. Let's say we have to validate so that only a valid email can be entered.
    If not valid then the Error Message appears next to the field
    072908_0945_Addingvalid1.png



  2. Now open the site in the sharepoint designer and then expand the list and open the Newform.aspx of the list to be validated

    072908_0945_Addingvalid2.png

  3. As you can see in the image above the Newform.aspx of Validation list is being opened in the sharepoint Designer.

  4. Now right click on this Validation list web part in sharepoint Designer and choose Web Part properties
    072908_0945_Addingvalid3.png



  5. The properties dialog box will open for the Validation list here. Choose Hidden under layout and say ok.
    (This web part can be deleted as well, but due to some Known problems because of deletion it is best to hide this).
    072908_0945_Addingvalid4.png



  6. Now click exactly underneath the hidden list web part and go to Insert->Sharepoint Controls-> Custom List Form… and Wizard will ask to choose a List or Document Library form on based
    Of existing list. Choose your Validation list and select New item form under type of from to create option and hit Ok.
    072908_0945_Addingvalid5.png



  7. You will get the Validation List underneath the hidden list as shown as selected image below.
    072908_0945_Addingvalid6.png



  8. Now from here we can customize all the controls based on requirement. As we are customizing the E-Mail
    Field, right click on the email field box and choose Show common control tasks from the context menu.
    072908_0945_Addingvalid7.png



  9. This will give you Common Formfield tasks option as shown below next to Email field. Here we can change
    The format of the data field selected (default is List form field). As we need Email field to be textbox where validation can be applied
    Choose Textbox from Format as dropdown instead of List form field.
    072908_0945_Addingvalid8.png



  10. After the above step, List will look like this (custom formatted)
    072908_0945_Addingvalid9.png



  11. Now drop a RegularExpressionValidator control from the Validation option under ASP.Net controls from the toolbar
    As shown below
    072908_0945_Addingvalid10.png




  12. Now specify the required properties (such as ControlToValidate, ErrorMessage, SetFocusOnError to true, Validate Expression) of the
    RegularExpressionValidator from the Tag Properties toolbar. For ControlToValidate choose the ID of the Email field
    After selecting it and getting the ID from the Tag Properties toolbar as you do in Visual Studio. See below the set attributes in blue
    For the Email Field
    072908_0945_Addingvalid11.png



  13. Now Save the changes and go back to the list in IE and try to type in invalid email id and you will get following
    072908_0945_Addingvalid12.png




Print this post

No comments: