Extending LightSwitch – In my previous post Visual Studio LightSwitch – True Power Lies In Simplicity, I showed how easy and quick it was to create a fully functional, data aware Windows Form. If you haven’t read the previous post, go check it out.
In this post however, I want to take it one step further. They say that no man is an island. Well, I can tell you with confidence that no app is an island either.
Using our previous application as a foundation, let us assume that we wanted to group members together according to some sort of classification. How easy would that be? Let us create another table to group members by their level of study within the organisation.
Extending LightSwitch – Add Data To Your Application
To add functionality to your existing LightSwitch application is as easy as 1-2-3. Let me show you how.
In the Solution Explorer, expand the Data Sources section.
Right click on the Application Data node and select to Add a table from the context menu.
As before, modify the new table’s properties. I called my table Group and added two fields called GroupName and GroupDescription.
Next, I need to add a relationship between the Member table and the Group table. This is because a member can belong to a group, and a group can belong to more than one member (Databases 101 here). So change your selection to the Member table and click on the Relationship menu item at the top of the screen. (I changed the table to the Member table to add the relationship, but you can easily have done this from the Group table too.)
This will open up the ‘Add New Relationship’ window. As mentioned before, a member can belong to one group only, but a group can be assigned to more than one member. This screen allows you to model this relationship visually. Have a look at the summary section below the tables diagram. It summarises your choices above in the From and To fields with regards to Multiplicity, On Delete Behavior and Navigation property. In this summary we can see that I have specified that a member must belong to a group. A Group can also have many members. Lastly, I can’t delete a group if it is still associated to a member.
Clicking on Ok will take you to the relationship screen from the perspective of the member table. Note that a foreign key for Group has been added to your Member table automatically.
You can also view this relationship from the perspective of the Group table.
Next it is time to create a screen for our Group table. From the menu above the table, click on the Screen menu item.
As in the previous article, select the List and Details Screen. Only this time, the screen data needs to come from the Groups table and the additional data needs to be selected as Group Details and Group Members (you will see why Group Members are added in a minute).
That’s it, click Ok and then run your application. When your application screen is displayed, take note of the TASKS menu in the top left. Click on that and select ‘Groups List Detail’. This will open the Group screen in a new tab.
As you can see, this screen allows you to add Groups to your application. In addition to that, because we selected to include the Group Members when we linked the Group table to the screen data above, we now have a members section on this form too. Right, before I explain too much, let me illustrate this with actual data. LightSwitch is really more powerful than you think.
Add a few new Groups by clicking on the appropriate menu item on the Group form.
After you have added the Groups, close the Groups screen and return to the Members screen. Select a member and edit it. You will now see that there is a Group field that is populated with the groups previously added.
Click the Ok button to save the modification and you will see….. hmmmmm. The group we just added is not displayed on the Members form? You probably look as puzzled as my picture in the screen shot. Ok, the reason for this is simple. We just need to edit the screen to add the additional field. In the bottom right of the screen, you will notice a link ‘Design Screen’. Click on that.
From the Customization windows that opens, you will see the various controls already present on the form. To the bottom of the Member Details node, you will see the existing fields and an ‘Add’ option.
Clicking on ‘Add’ will bring up a context menu. Select ‘Group’ from this selection.
When you save this, you will now see the field added to your members screen.
Go ahead an add a couple of additional members to your data.
This time, if you return to your Groups List Detail screen, you will see the beauty of the Members section. It now logically groups all members by the selected group in the left groups list.
Change the Group selection in the left, and the members associated with the selected group are displayed in the Members section to the right. You are now filtering Member data based upon the Group selected without you having to add a single line of code.
Lastly, you can also add members right here from within the Groups screen. This kind of functionality is all added for you with the incredible power of LightSwitch. I do have to say that working with LightSwitch makes me feel almost obsolete as a programmer. But somehow I think that there is much more to this technology than meets the eye.
In no time at all, we were able to add additional data to our application, extending LightSwitch to include Groups. In a similar manner, we can add other tables and screens to our application. By doing this we are building it to become the app we need it to be without wasting time coding mundane Add, Edit and Delete functions. LightSwitch is a hidden gem more developers should explore. Come with me, and see what LightSwitch has to offer.
Latest posts by Dirk Strauss (see all)
- The Daily Six Pack: December 12, 2014 - 12 December, 2014 06:00:44
- Visual Studio 2015 Preview and Windows 10 Technical Preview – Try Them On Azure Now - 12 December, 2014 01:00:41
- The Daily Six Pack: December 11, 2014 - 11 December, 2014 06:00:06
- Rebracer – Save Visual Studio Editor Formatting Settings Per Solution - 11 December, 2014 01:00:38
- The Daily Six Pack: December 10, 2014 - 10 December, 2014 06:00:11