(X) Hide this
    • Login
    • Join
      • Say No Bots Generate New Image
        By clicking 'Register' you accept the terms of use .

Beginners Guide to Visual Studio LightSwitch (Part - 5) - Working with Custom Validation

(11 votes)
Kunal Chowdhury
>
Kunal Chowdhury
Joined Mar 28, 2010
Articles:   7
Comments:   14
More Articles
6 comments   /   posted on Jan 04, 2011
Categories:   LightSwitch

 This article is Part 5 of the series “Beginners Guide to Visual Studio LightSwitch”.

Visual Studio LightSwitch is a new tool for building data-driven Silverlight Application using Visual Studio IDE. It automatically generates the User Interface for a DataSource without writing any code. You can write a small amount of code also to meet your requirement.

In my previous chapter “Beginners Guide to Visual Studio LightSwitch (Part – 4)” I guided you step-by-step process to create a List and Details screen. There I demonstrated you, how to integrate two or more tables inside a single screen.

In this chapter, I am going to demonstrate you of doing custom validation using Visual Studio LightSwitch. This time we will jump into writing some code to extend the functionalities.

 

Background

If you are new to Visual Studio LightSwitch, I will first ask you to read the previous three chapters of this tutorial, where I demonstrated it in detail. In my 3rd chapter, I discussed the following topics:

    • Creating the List and Details Screen
    • UI Screen Features
    • Adding a New Table
    • Creating the Validation Rules
    • Adding Relationship between two tables
    • Creating the new List and Details Screen
    • Application in Action

In this chapter we learn how to write custom validation for our table fields. Read it and start implementing your own logic. A quick jump to code will be there (for the first time). Enjoy reading the tutorial.

 

Setting up the basic application

Hope, you already read my first four chapters mentioned above. If not, read them first. It will be easy for you to get the base. Let’s start creating our new LightSwitch project. You know how to do that. Select the “LightSwitch Application for C#” template from the new project dialog. Give a proper name & location for your project and click “OK” to start creating the basic project.

image

Give some time to Visual Studio 2010 IDE to create the project. Once the project has been created, you will see the below screen inside the Visual Studio IDE:

image

Now you need to create a new table to start with the application. Create a simple basic table where we can add some custom validation logic. Chose your fields as per your requirement. For our sample, we will create a Employee table and there we will have some columns in it. Let us create 4 custom columns named “Firstname” of type(String), “Lastname” of type(String), “InTime” of type(DateTime) and “OutTime” of type(DateTime) to store the records of employees in and out time of particular day.

Here is the table structure for your reference:

image

Check “Required” field to do the null validation automatically by the tool. Hence, we don’t have to do it explicitly. I already demonstrated the same in my earlier chapters. Read them to understand it.

 

Validating Fields

Now it’s time to start the validation process for each field. Let’s start with the “Firstname”. Click on the row as marked in the below screenshot. Now go to the properties panel and scroll down it to the end. There you will find a grouped item named “Validation”. This panel hosts all the information of validation related to the selected field. Have a look it here:

image

As “Firstname” field is a String, you will see only “Maximum Length” as the default validation rule. If you want to change the maximum length of the string field, you can do that from here. If you want to write some custom validation rule, you can do it here by just clicking on the “Custom Validation” link from the properties panel. See the above screenshot for the details.

Let us check for the other field. This time we will do it for DateTime field. Select the InTime as shown below and check the properties panel. In the validation tab you will now see two fields “Minimum Value” and “Maximum Value”. Here you can specify your own custom value.

image

As mentioned above, we also have a link called “Custom Validation” here. You can write your own logic for validation by clicking it. Let’s do it. This is the first time we are going to write some code for LightSwitch application.

Click the “Custom Validation” link in the properties panel. This will open the code editor window inside the IDE. This editor window is very familiar to you. In the editor window, you will see the class file opened for you named “Employee”. This is nothing but the name of the table. It has a single event there and it looks as below:

image

You can do whatever validation logic you want it here. Want to write some code? Oh yeah! Ok, before doing anything, let me show you the API to throw the message on validation error. The output parameter “results” of type “EntityValidationResultsBuilder” has some APIs. If you want to throw some property validation error, use the “AddPropertyError()” method to return back the error message to the end user.

Have a look into the APIs mentioned in the below screenshot:

image

Ok, as per our requirement of the application, the OutTime of the employee must be after the InTime. An employee can’t go out if he/she is not in, am I right? So, let’s write some logic for that. If InTime is greater than OutTime (by any mistake by the end user, of-course), we will throw the error message to the user. We will use AddPropertyError() which takes string as message.

Have a look into the implementation here:

image

Hope, you got it. So, do it for the OutTime field too. Go to the table designer and select the row for “OutTime”. From the properties panel, click the “Custom Validation”, as we did it earlier. You will see the event generated for that in the code editor window.

Here, check whether OutTime is less than InTime. If so, throw the error as shown below:

image

We are ready with the custom validation. If you want to check for the various default validation rule for different controls, try it out. The custom validation is same for all the cases and if any issue, let me know. I will try to answer you as soon as possible.

 

See it in Action

Before closing this tutorial, you must want to see the demo in action. You must want to check whether we achieve our requirement or not. Hence, create a screen to check it out. For our sample, we will create an Editable Grid Screen for simplicity. Add the screen and don’t forget to chose the Employees table from the Screen Data dropdown.

image

Click “OK” and the IDE will create the screen for you. To show this demo, we don’t need to do any UI customization. Build the project. Hope, it will build successfully. If any issue, try to fix the error. Now run the application. You will see that, the application is up into the screen with the editable datagrid page opened in the main tab.

image

Try to add some records and you will notice that, the InTime and OutTime field has been automatically populated by the application. It will show you the current date time. Try to save the record. It will save properly without any error as the DateTime inserted is perfect.

image

Now, add a new record. Click on the InTime column. You will see that the calendar control. Yes, as you selected the column as DateTime type, the tool automatically added the calendar control for you. Now chose an earlier date from the calendar for the InTime field. Don’t change anything for the OutTime. Try to save the record. Woot, this time also the record saved successfully, because the validation rule passed the case.

image

Let us do something wrong now. Try to select a future date for the InTime. You will see the validation rule fails and the error message shown in the screen with a Red border to the InTime field. Have a look it here:

image

If you place the cursor into the Date field now, you will see the same error message that we wrote in the code window for the validation error of the InTime field.

image

Try to change the OutTime to a previous date. Woo, you will see the validation rule failed here too and the field automatically marked with a Red border.

image

If you place the cursor inside the field, you will see the error message shown into the screen. This is the same message we entered for the validation error of the OutTime field.

image

Try to save the table data after adding some records with empty text for the Firstname and Lastname field. You will see that, here also the validation failed because we marked those field as Required field. Hence, null record will throw validation error.

image

Correct the validation error and now you will be able to save the records without any issue.

 

End Note

You can see that, throughout the whole application (for all the previous 4 chapters) I never wrote a single line of code. I never did write a single line of XAML code to create the UI. It is presented by the tool template automatically. It has a huge feature to do automatically. From the UI design to add, update, delete and even sort, filter all are done automatically by the framework.

Only in this chapter, I introduced the code with you to extend the validation rule. I hope, you enjoyed this chapter of the series too. Huge nos. of figures I used here, so that, you can understand each steps very easily. If you liked this article, please don’t forget to share your feedback here. Appreciate your feedback, comments, suggestion and vote.

 

About the Author

Kunal_Chowdhury_Silverlight_MVP_pngKunal is a Microsoft MVP in Silverlight, currently working as a Software Engineer in Pune, India. He is a Silverlight enthusiastic and want to work in Silverlight, WPF & Microsoft Surface. Apart from his daily office work, he spends a huge time on online communities. Writing articles, blogging, tweeting and answering to forums are some of his regular activities. He likes to share knowledge and learn newer things.

Follow him in his blog: http://www.kunal-chowdhury.com/ 

Follow his new site: http://www.silverlight-zone.com/silverlight-zone.com for daily Silverlight related news.


Subscribe

Comments

  • SlimH2S

    RE: Beginners Guide to Visual Studio LightSwitch (Part - 5) - Working with Custom Validation


    posted by SlimH2S on Feb 14, 2011 01:55

    Thank you for this good tutos.

    I think part 6 will talk about the application deployment.

  • -_-

    RE: Beginners Guide to Visual Studio LightSwitch (Part - 5) - Working with Custom Validation


    posted by Akiii on Mar 20, 2011 05:38

    Hi kunal....

    Your tutorials are great......please give us the part-6 and more.....as i am learning from this....

    Thanks

    Akiii

  • -_-

    RE: Beginners Guide to Visual Studio LightSwitch (Part - 5) - Working with Custom Validation


    posted by Rajeeivf on Apr 02, 2011 07:38

    very nice beginner's tutorials sir...

    god bless u

  • -_-

    RE: Beginners Guide to Visual Studio LightSwitch (Part - 5) - Working with Custom Validation


    posted by jhon on May 12, 2011 18:04
    its great ...pls continue
  • dwarapudi

    Re: Beginners Guide to Visual Studio LightSwitch (Part - 5) - Working with Custom Validation


    posted by dwarapudi on Jul 21, 2011 21:00

    Kunal,

    Today I purchased and downloaded the Beginners Guide to Visual Studio LightSwitch, but the content is too old. Please update the content to Beta 2 version. All most all the content is already available in microsoft.com/LightSwitch .

    I didn't find any thing new. Please put more advanced code when you are releasing new version.

    Thank you
    Rama

    rama@shoppersstop.com.au

     

     

  • kunal2383

    Re: Beginners Guide to Visual Studio LightSwitch (Part - 5) - Working with Custom Validation


    posted by kunal2383 on Jul 21, 2011 21:07

    Hi dwarapudi,

    This was written when it was in Beta 1 stage and I am planning to write something more on this topic. This was my first ebook based on the published articles and actually done by SilverlightShow.net.

Add Comment

Login to comment:
  *      *       

From this series