Exercise 1: Reading an Existing SPListItem

This exercise adds code to the starter solution to show how you can use the Silverlight client object model to connect to an existing List on an existing site and read values from an existing item. The starter solution is set up only to contain the basic project structure required for this exercise as well as the non-coding elements necessary to jump right in and get started.

Task 1 – Preparing

In this task, you will open the starter solution in VS 2010 and explore the environment to understand what has been done to get things set up for the rest of the exercise.

1. Using Visual Studio 2010, open the starter solution named IntroducingSLCOM from the <Install>\Labs\IntroducingSLObjectModel\source\begin\ folder. Solution Explorer should look like this:

   Figure 1

   Solution Explorer

2. Notice that there are two projects in this solution:
   1. IntroducingSLCOM – this is the actual project that will be deployed to SharePoint. It is an Empty SharePoint Project with a new project item added to it - the SilverlightWebPart1 item just above key.snk in the picture.
   2. SilverlightApplication1 – this is the Silverlight project in which we will build our Silverlight application. The output of this project is packaged with the output of the SilverlightWebPart1 project and deployed to SharePoint.
3. Double-click on the Properties node in Solution Explorer underneath the IntroducingSLCOM project and then open the SharePoint tab. Notice that the checkbox next to Enable Silverlight debugging is selected. This is necessary if we need to step through our code later on. Close the properties pane.
4. [Optional] If desired, explore the different files in both projects. Some of these files and/or the content in the files are used in later Exercises.

5. To finish exploring and see the results of what has been set up for you, hit the F5 key to deploy and activate the starter solution. After Visual Studio launches the browser, navigate to https://intranet.contoso.com/sites/IntroducingSLCOM/SitePages/SilverlightApplication1WebPartPage.aspx. Your page should look like this:

   Figure 2

   SilverlightApplication1 Web page

6. All of the UI elements are shown on the page, but they are not yet functional. You will add the functionality throughout the rest of this lab.

Task 2 – Adding the Client Object Model Code

In this task you will add the code necessary to call into SharePoint.

1. From Solution Explorer, in the SilverlightApplication1 project, double-click the file MainPage.xaml to open it and display the Silverlight design canvas.
2. Double-click on the Read button in the canvas to open up the MainPage.xaml.cs code-behind file for the Silverlight page.

3. Inside the ButtonRead_Click event that was added when we double-clicked the button from the XAML, add the following code

   C#

   ClientContext spContext = new ClientContext(siteUrl); list = spContext.Web.Lists.GetByTitle("Announcements"); spContext.Load(list); item = list.GetItemById(1); spContext.Load(item); spContext.ExecuteQueryAsync(OnReadSuccess, OnFailure);

   This code is responsible for connecting to the current SharePoint site, retrieving the Announcements list, and retrieving the item with an ID of 1. However, note that due to the asynchronous nature of the Silverlight client object model, we don’t actually start talking to the server until the last line in this method – with the ExecuteQueryAsync call. Until that point, all of our code is added to a batch that is committed together. This means that our objects are not actually populated until we’ve called up to the server. If we were to try to access properties of item, for example, our code would fail. The ExecuteQueyAsync method contains references to two callback methods – one for when our batch succeeds and one for when it fails. As the name implies, the ExecuteQueryAsync method executes asynchronously, meaning it doesn’t lock the UI while waiting for the response from the server – the user is free to continue working.

4. Position your cursor after the closing curly brace for the ButtonReadClick event and add the following code:

   C#

   private void OnFailure(object sender, ClientRequestFailedEventArgs args) { Dispatcher.BeginInvoke(() => { MessageBox.Show("Request failed. " + args.Message + "\n" + args.StackTrace); }); }

   This is the method that will be called if our call to the server fails. For the sake of this lab, it simply displays a popup message. Note the use of the Dispatcher.BeginInvoke method to tell the UI thread to show the message we want shown to the user. As we go through the rest of the exercises, you see that this method if used for every batch operation in the lab. This is not necessarily real-world but it is acceptable for a lab.

5. Position your cursor after the closing curly brace for the OnFailure method and add the following code:

   C#

   private void OnReadSuccess(object sender, ClientRequestSucceededEventArgs args) { Dispatcher.BeginInvoke(() => { MessageBox.Show("RetrievedItem Title: " + item["Title"]); }); }

   This code is called when our call to the server succeeds. It finishes off our logic – reading and working with the list item. This code also utilizes the Dispatcher.BeginInvoke method to tell the UI thread to show the message we want shown to the user. In this case, the message we display includes the Title value retrieved from the SPListItem.

6. This completes the coding, so hit F5 to test out the solution. After Visual Studio launches the browser, navigate to https://intranet.contoso.com/sites/IntroducingSLCOM/SitePages/SilverlightApplication1WebPartPage.aspx.

7. Click the Read button in the Silverlight web part to call our code. You should see a popup:

   Figure 3

   Displayed popup

Exercise 1 Verification

In order to verify that you have correctly performed all steps of exercise 1, proceed as follows:

Verification 1

In this verification, you can compare the anticipated output shown in step 7 with the actual output shown on your screen. If the two match, you have completed the exercise successfully.