The easiest way to create modern business applications for the Cloud and Office 365
NOTE: This article was written against Visual Studio LightSwitch 2011 but has been updated for LightSwitch in Visual Studio 2012. To view the latest version click here.
In Course Manager Sample Part 2 – Setting up Data, we created tables, relationships, queries, and learned some useful data customizations. Now we’re ready to build screens. One of the first things I usually like to do (as a LightSwitch developer) is to build some basic screens to enter and manipulate test data. They can also be useful end-user screens for a data admin. I call them the “raw data screens.” Obviously we don’t want to give all users access to these special screens. They need to be permission based.
In this post, we will set up permissions, create raw data screens, write permission logic, and learn some screen customization techniques. Let’s continue our “SimpleCourseManager” project from Part 2!
Download the Course Manager Sample Application
Course Manager is a Desktop application using Windows authentication. Let’s go ahead a set that up. Double click on Properties in the Solution Explorer to open the application designer.
Under “Application Type” tab, make sure Desktop is selected (this is the default).
Under the “Access Control” tab, select “Use Windows authentication” and “Allow any authenticated Windows user.” By the way “Allow any authenticated Windows user” is a new feature introduced in Beta 2. If you need a general app for every employee in your company, you no longer have to manually create user accounts for everyone. Instead, any authenticated Windows user has access to the application. You can then define special permissions on top of this general permission (which is what we will be doing).
You will also find a built-in SecruityAdministration in the list of permissions. LightSwitch uses this permission to show or hide the built-in screens that define Users and Roles. As the developer, I want to make sure that I have all the permissions under debug mode (so I can see all the screens). Check “Granted for debug” box for SecurityAdministration.
Let’s add another permission called “ViewAdminScreen” to the list. We will use it to show or hide our raw data screens later. Again, check “Granted for debug” box.
At this point, if you hit F5 to launch the running app, you will see a Desktop application with your Windows credential at the lower right corner. You will also see the Administration menu group with the built-in Roles and Users screens (because we’ve enabled SecurityAdministration permission for debug mode).
Now let’s create our first screen. Create a list-details screen on Students called “ManageStudents.”
In the screen designer, use the “Write Code” dropdown menu to select ManageStudents_CanRun. This method defines the condition ManageStudents screen will show up in the running application.
We only want to show this raw data screen for users with ViewAdminScreen permission (that we defined in earlier steps). In the code editor, write:
Private Sub ManageStudents_CanRun(ByRef result As Boolean)
result = User.HasPermission(Permissions.ViewAdminScreen)
Let’s hit F5 again. We will see the Manage Students screen we just created. By default, it is place under Tasks menu group. Let’s organize all the raw data screens under Administration menu group.
Let’s go back in the LightSwitch IDE and open application designer. Under “Screen Navigation” tab, delete Manage Students screen from Tasks group and add it under Administration group.
Follow the same steps to add other raw data screens (with ViewAdminScreen permission):
List and Details
Courses (include Sections, CourseCategories)
Organize your screens to have this menu structure.
Use these screens to enter some sample data for students, instructors, categories, courses, and sections.
In the Course Manager sample project, we’ve also made some screen customizations to improve user experience. Here are the highlights:
In “Manage Students” screen, we’d like to:
In the screen designer, select Student’s Summary control (under the List control). Check “Show as Link” in the Properties.
In the screen designer, right click on “Student Details” node, select “Add Group” to add a group node.
Change the group node to use “Address Editor” control.
Now, drag the Street node and drop it in (STREET LINE 1). Repeat the drag-and-drop for City, State, and Zip.
In the screen designer, select “Student Details” node. Click on “+ Add” button and select “Created Time” to add the field. Repeat and add “Updated Time” and “Updated By.”
Use the “Write Code” dropdown menu in the command bar. Select ManageStudents_Created.
<Screen>_Created is called after the UI elements on the screen have been constructed. We want to make them read-only. Write:
Private Sub ManageStudents_Created()
FindControl("CreatedTime").IsReadOnly = True
FindControl("UpdatedTime").IsReadOnly = True
FindControl("UpdatedBy").IsReadOnly = True
In “Manage Courses” screen, we’d like to:
We now have a functional Desktop application using Windows authentication. We also defined permission logic to limit certain screens to privileged users. Coming up next: Course Manager Sample Part 4: Implementing the Workflow.
Did I miss something ? In my project, the fields "Created time", "Updated Time" and "Updated by" don't exist. A kinf of magic ?
@TT - If you look at part 2, we actually added these fields in the Student table. We also set them to not "Display by Default." Therefore, the screen deisnger doesn't automatically include these fields (that's why we are adding them manually here).
Hope that help!
Did anything changed here from Beta 2 to V1 ?
This particular sample should run the same in V1. There were some updates post Beta 2 that you can read about here:
Hope this helps!
In the Manage courses section at the end you say what we'd LIKE to do, but unlike the other sections, you don't actually say how to do it. Kind of like saying, "I'd like to bake a delicious cake, but offer no recipe isn't it?"
Hi Andy, just like what Greg said, could you please go over this part:
- Use a “List box mover” UI for the many-to-many relationship (see “How to Create a Many-to-Many Relationship”)
I think I will become a great follower.Just want to say your story is striking. The clarity in your post is simply striking and i can take for granted you are an expert on this subject.