Creating a workflow with Visual Studio Lightswitch

No, not a sharepoint workflow. That is a totally different task and cannot be done with LS.

The workflow I am referring to is how certain data needs to go from one screen to another.

For all those who have tried VS-LS, it is really a pretty cool tool to create screens for data entry and searching. But what if I want to establish some form of workflow? Maybe creating a new client then going straight to creating a transaction for this new patient? Yes, that is what this installment of my LightSwitch blog will show.

So I start off with a small application that I made for this demo. It is a simple contacts management for a small clinic (am planning to donate this app to my cousin Andrew in Canada who owns a physical therapy and rehabilitation clinic). Here is a screenshot of what I have:

It’s basically your off the shelf application that LightSwitch gives you once you add screens. I just basically have Therapist, Patient and Appointments tables set up, popped out a few screens and there it is.

Although Visual Studio Lightswitch can create a “CreateNewPatient” screen for me (which I have already done), I want to extend this application by adding a workflow. What I want is, after the secretary creates a new Patient, the system should redirect the secretary to create an appointment for that Patient.

Here is how it’s done:

First let’s take a look at the screen for adding a new Patient during design time..

I highlighted two areas; the one on the left is representative of the viewmodel that lightwsitch creates. It shows that we have a “patientProperty” object and a list of properties for this object. At the right area, I highlighted the controls that LightSwitch chose for you. What I want to highlight here, is that lightswitch will do its best to choose the proper control for the proper data type. With that in mind, users should be informed that in order for VS-LS to consistently provide functional UI, you must really design your tables correctly. Choose the proper data type, define the correct relationships and all.

And to illustrate that further, here is a screenshot of the CreateNewAppointment screen that VS-LS created for me based on the datatypes that I chose and the relationships that I defined:

VS-LS chooses an appropriate control to hold/represent the data that you need. A textbox for data entry, Date Picker for the appointmentDate and DateTimePicker for startTime and endTime. Also, you might notice that for the patient and therapist entries, LS chose to use a Modal Window Picker because I have already defined the relationships for these tables.

Here is a screenshot of the relationship definition and see how clearly a relationship can be defined:


Okay. Time to get to the task at hand, adding a “workflow”.

With VS-LS, your screens will have the objects that it created for you as the datasource. It’s pretty much like binding the whole screen to a datasource object and binding each control to a property of your object.

So since what we want is for the application to go straight to the Create New Appointment screen right after a new Patient is created, we will need to do two things:

  1. Overload the constructor of the create new appointment screen so that it will accept a Patient object and load the properties immediately (so to speak)
  2. Save the patient data upon creation then call and open the Create New Appointment screen while passing the new patient object.

So let’s modify the Create New Appointment screen to accept an optional parameter on load. Let’s take a look at the default code that LIghtswitch loads on a screen by clicking the “Write Code” button while designing the screen..



void CreateNewappointment_BeforeDataInitialize()


// Write your code here.

this.appointmentProperty = new



void CreateNewappointment_Saved()


// Write your code here.







There is something worth taking notice of here. There are two events that you will see, BeforeDataInitialize and Saved. What you will see here is that LightSwitch’s code acts on data, rather than the screen/form. The code we have is not UI related code. This further illustrates that VS-LS follows an MVVM pattern. I just want to highlight that although it looks like LightSwitch is just a big wizard, it still follows a tried and tested pattern.

So what do I do with this code? I comment out the code for the Saved() function so I can replace it.

Next I add a new dataItem to my screen that will be my optional parameter to accept the PatientID. This is done by clicking “Add Data Item” and choosing the proper datatype for the parameter we will receive, give it a name and save.

Then I declare that as a Parameter on the properties explorer by checking the Is Parameter checkbox.

Okay, so now we have an optional parameter. Next thing I need to do is to go to the Loaded event of the screen then add some code.

bool hasPatient = false;

void CreateNewappointment_Loaded()


if (!hasPatient)


this.appointmentProperty.patient = this.DataWorkspace.ApplicationData.patients_Single(newPatientID);

hasPatient = true;




Let us dissect these few lines of code:

    bool hasPatient = false; ß this line of code declares a bool variable called hasPatient.. DUH!!!!

This is a much nicer line of code:


this.appointmentProperty.patient = this.DataWorkspace.ApplicationData.patients_Single(newPatientID);


here you will see a lot of things but the most interesting part (at least for me) is the DataWorkspace so I’ll try to expand on that.

The DataWorkspace is the place where LS maintains the “state” of your data. While running your LightSwitch app, you will notice that the tab displays an Asterisk while you are either editing or adding a new row. This tells the user that the data displayed is currently in a “dirty” state and there has been changes. All this happens without you writing any code for that.

Finally, this line basically issues a “select.. where” statement to the database, pretty much like how EF(Entity Framework) does it. I haven’t tried it yet but I think there is a good chance that if one runs profilers, we will see a select statement issued somewhere :p

Now it’s time to tell the CreateNewPatient screen to get the newly saved PatientID and pass it to the CreateNewAppointment screen.

To do that, I’ll add a new button to the CreateNewPatient screen and add some code to open the CreateNewAppointment screen


And as I write the code..

Notice two things:

  1. I used the “Application” namespace, which is pretty familiar already and..
  2. The input parameter newPatientID is already showing in the intellisense, which tells us that what we did earlier was correct


So we now supply the newPatientID by getting it from the PatientProperty

Then I removed the code for the Saved method because it closes the form.

Then when I run this and add a new “familiar” patient and his health condition information:

We now see the button I added to open the CreateNewAppointment screen.. and when I click, the application opens the Create new Appointment screen with the Patient’s name loaded automagically!


I’ll still polish this up by adding validation and controlling the flow.


And that’s how you add a “workflow” in a Visual Studio Lightswitch application.


This entry was posted in Computers and Internet. Bookmark the permalink.

One Response to Creating a workflow with Visual Studio Lightswitch

  1. Pingback: Implementing Access Control on a Visual Studio LightSwitch Application | Edu's "Techie" Blog

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s