Exercise Duration
: 20 minutes
Exercise Overview
This example shows how to create a Silverlight Application that uses the SharePoint Client Object model to render SharePoint list data. It also shows how to host that Silverlight Application in the Silverlight web part on SharePoint.
Feature Overview
The Silverlight Web Part allows developers and users to easily add Silverlight applications (*.XAP) to SharePoint sites. Client Object Model can be used in Silverlight to access SharePoint programmatically.
Task 1: Create a Silverlight Application for the SharePoint Client Object Model.
1.
Open Visual Studio 2010 from the Start | Programs | Visual Studio 2010 menu.
2.
Create a new project by using File | New Project.
3.
Pick the Visual C# | Silverlight templates.
4. From the Visual C# | Silverlight templates select the Silverlight Application
template.
5. Use SPSilverlightExample as the name.
6. Set the location to be C:\SPHOLs
.
7. Press OK to create the project.
8.
When the New Silverlight Application dialog appears, accept all the defaults by pressing OK.
9.
Right-click on the SPSilverlightExample project in the Solution Explorer and select Add Reference.
10.
Go to the Browse tab in the Add Reference dialog, and add a reference to the two assemblies from the specified location:
C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\LAYOUTS\ClientBin\
The file names are: Microsoft.SharePoint.Client.Silverlight.dll and Microsoft.SharePoint.Client.Silverlight.Runtime.dll.
Task 2: Write code to access and render SharePoint List Data
1.
Open the Toolbox and expand Silverlight Controls.
2.
Drag a DataGrid control onto the Silverlight Designer.
3.
In the Solution Explorer right-click on Page.xaml and select View Code.
4.
Inside the Page.xaml.cs add the following using statement at the top of the file:
using
Microsoft.SharePoint.Client;
5. Add the following class before the Page class:
public class Project
{
public String Title { get; set; }
public DateTime DueDate { get; set; }
public String Description { get; set; }
}
6. Add the following member to the Page class itself:
ListItemCollection _projectItems;
7. Add the following code to the Page Constructor
var context = new
ClientContext(ApplicationContext.Current.Url);
context.Load(context.Web);
var projects = context.Web.Lists.GetByTitle(“Projects”
);
context.Load(Projects);
var query = new
Microsoft.SharePoint.Client.CamlQuery();
var strQuery = “<View><Query><Where><Gt>”
+
“<FieldRef Name=’Due_x0020_Date’ />”
+
“<Value Type=’DateTime’>2008-01-1T00:00:00Z</Value>”
+
“</Gt></Where></Query><ViewFields>”
+
“<FieldRef Name=\”Title\” /><FieldRef Name=\”Description\” />”
+
“<FieldRef Name=\”Due_x0020_Date\” />”
+
“</ViewFields></View>”
;
query.ViewXml =
strQuery;
_projectItems = projects.
GetItems(query);
context.
Load(_projectItems);
context.ExecuteQueryAsync(OnRequestSucceeded, null
);
8.
Add the following code inside of the Page class after the constructor:
private void
OnRequestSucceeded(Object sender, ClientRequestSucceededEventArgs args)
{
// this is not called on the UI thread
Dispatcher.BeginInvoke(BindData);
}
private void
BindData()
{
var list = new List<Project>();
foreach (var li in _projectItems)
{
list.Add(new Project
{
Title = li["Title"].ToString(),
DueDate = Convert.ToDateTime(li["Due_x0020_Date"].ToString()),
Description = li["Description"].ToString()
});
}
dataGrid1.DataContext = list;}
This code initializes the SharePoint Silverlight client object model context (ClientContext). It then gets a reference to the Projects list. Runs a simple CAML query against the list to pull all projects with a duedate greater than 1/1/2008. The results are converted into a list of Projects and bound to the Silverlight DataGrid control.
Task 3: Deploy and Test using the SharePoint Silverlight web part.
To deploy the solution to SharePoint the resulting .xap file needs to be in the C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\LAYOUTS\ClientBin folder.
1.
Right click on your project and select properties and select the Build tab.
2.
Change the output path to the following: C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\LAYOUTS\ClientBin.
3. Build the solution and fix any typos that may have occurred
.
4.
Add the SharePoint Silverlight web part to a web part page:
Click the Edit button to put the page in edit mode.
Click Insert
Click Web Part
Click Authoring
Click Silverlight Web Part
Click Add
5.
When prompted type in: /_layouts/ClientBin/SPSilverlightExample.xap
The rendered web part looks like this:
Exercise Summary
In this walkthrough you built a Silverlight application that accesses SharePoint lists using the Client Object Model.
