Read SharePoint 2010 List in Silverlight using REST – Silverlight with SharePoint 2010 - Part II

Posted by: Pravinkumar Dabade , on 4/24/2011, in Category SharePoint
Views: 39011
Abstract: In this article, we will see how to fetch SharePoint 2010 list data in Silverlight application using REST Service ‘ListData.svc’. We will then deploy the XAP file and display the data in our SharePoint Site using Silverlight web part

In this article, we will see how to fetch SharePoint 2010 list data in Silverlight application using REST Service ‘ListData.svc’. We will then deploy the XAP file and display the data in our SharePoint Site using Silverlight web part. I have already explained how to use the Silverlight webpart in SharePoint 2010 in my previous article - Silverlight Integration with SharePoint 2010 – Part I

Silverlight applications can easily read and write data back to SharePoint lists by using different methods. One of the methods of reading and writing the data back into SharePoint Lists is by using ‘REST Services’. So we need to first create a SharePoint site using ‘Team site’ template. The steps to create a SharePoint Site using a Template ‘Team Site’ remains the same, as shown in my previous article, SharePoint Dashboard with Common Filters using PerformancePoint Services 2010. Now after you have created a SharePoint site with ‘Team Site’ template, let’s add a ‘Customers’ list as described in the below table – To create a list, click on ‘Lists’ link from the left hand navigation pane and click on ‘Create’ button. The dialog box of ‘Create’ will be shown as below –

 

clip_image002

Once we create a first list, we need to add couple of columns as described in the table given below. To create a column, click on list settings from the top ‘Ribbon’ as shown below –

 clip_image003

Now click on ‘Create Column’ link from the list settings page as shown below –

clip_image004

 Now create the list as described below. Also add some sample data to the list. Customers List –

clip_image005 Let’s add sample data to our ‘Customers’ list.  Now let’s create a Silverlight application which will read the data from the SharePoint list ‘Customers’ in a Listbox. I will use Microsoft Expression Blend for designing the Silverlight application. For this we will some controls of Silverlight like the Textblock, Textbox and Button control. So let’s create a Silverlight application using Blend and choosing the template ‘Silverlight Application’ and name it as ‘SharePointRESTInSL’. Once you create a Silverlight project, change the ‘Height’ and ‘Width’ of User Control and Grid layout to ‘400’ and ‘300’ respectively. Now add a border control on the Silverlight page and set its height and width to ‘400’ and ‘300’ respectively. Now add a Listbox control in the border and change the background color as you like. Your list box control now will look like below –

 clip_image007

Now let’s design a Listbox Item Template which will display the SharePoint control data. Let’s add below code between ‘<Grid></Grid>’ –

 listbox-itemtemplate-sharepoint After adding the markup, your screen should look similar to the following –

 clip_image008

Now open this project in Visual studio 2010 and let’s start coding. First we need to add a reference to our Data service ‘ListData.svc’ as shown below –

 clip_image009

Please note that I have given a name to my service reference as ‘PurchaseOrderProxy’. As soon as you add a reference of this service, it will create a data context with site name. Now we need to import a PurchaseOrderProxy reference in our MainPage.xaml.cs file. Once you import a namespace, let’s declare some variables at the class level as shown below –

 clip_image010

The first two variables are declared to access the ‘ListData.svc’ service URL and the third variable is declared for accessing the ‘Customers’ list data. Now let’s write the following code in our constructor as shown below –

 silverlight-url-0424

In the above code, we are first declaring a variable for ‘Uri’ which will take an address of Silverlight hosting application to render the XAML. Then we are setting the context of our data using the site data context which takes the address of our List Data service and then assigns the customers collection to our Listbox. Now let’s add two methods in our code behind. First method ‘GetAllCustomers’ will send a query using ‘LINQ Expression’ to SharePoint site. For querying, we are using ‘DataServiceQuery’ class which belongs to a namespace ‘using System.Data.Services.Client;’. Second method ‘DisplayAllCustomers’ will add all customer records to our collection. The methods are shown below –

get-all-customers-linq

Second method to add all customers to our collection –

addcustomers-collection-linq

Now on the button click, we will call a method GetAllCustomers by passing a parameter ‘Country’. The code is as shown below –

private void btnSearch_Click(object sender, RoutedEventArgs e) { GetAllCustomers(txtCountry.Text); }

Now compile your Silverlight application. It will build a .XAP file. We need to upload this ‘.XAP’ file to our SharePoint Site. To upload the ‘.XAP’ file, click on ‘Shared Documents’ library in our site from the left side navigation pane and click on ‘Add Document’ link button as shown below –

clip_image011

This will ask you to browse the document. So let’s browse the ‘.XAP’ file and add it in our SharePoint Site. Now go to your home page and click on ‘Edit’ button. Go to ‘Insert’ tab and click on ‘Web Part’ button as shown below –

 clip_image012

From the list of web parts, choose ‘Media and Content’ and choose ‘Silverlight Web Part’ as shown below –

 clip_image013

When we add a web part, it will ask you for a path of your ‘.XAP’ file. Copy the ‘XAP’ file path and click ‘OK’ button. Now you will see your web part on the home page of your site. Enter the starting character in the textbox and click on ‘Search Customers’ button and you will see all the customers as shown below –

 clip_image014

Summary – In this article, we have seen how to use REST Services of SharePoint 2010 in Silverlight application and read the list data. We have also seen how to use the Silverlight application in our SharePoint site using ‘Silverlight Web Part’.

The entire source code of this article can be downloaded over here

Give me a +1 if you think it was a good article. Thanks!
Recommended Articles
Pravinkumar, works as a freelance trainer and consultant on Microsoft Technologies. He is having over 10 years of experience in IT and is also a Microsoft Certified Trainer(MCT). He has conducted various corporate trainings on all versions of .NET Technologies including .NET, SharePoint Server, Microsoft SQL Server, Silverlight, ASP.NET, Microsoft PerformancePoint Server 2007 (Monitoring). He is passionate about learning new technologies from Microsoft. You can contact Pravinkumar at dabade[dot]pravinkumar[attherate]gmail[dot]com


Page copy protected against web site content infringement by Copyscape


User Feedback
Comment posted by Kokila on Monday, May 21, 2012 4:22 AM
Hi,

I am not able to add services listdata.svc on local machine.Erro is like 'BAD REquest' is coming.Could you please help me out for how will i use REST in sharepoint 2010.
Comment posted by Ken on Wednesday, October 24, 2012 5:41 AM
Hi,
How can we get the value of a Choice type column?
ex: Choice - Checkboxes (allow multiple selections)
Comment posted by GaneshRaj R on Wednesday, June 26, 2013 11:10 PM
Thank you it helped me a lot

Post your comment
Name:  
E-mail: (Will not be displayed)
Comment:
Insert Cancel