SQL SERVER Hosting :: Fetch data from SQL Server database in Silverlight,

In this tutorial we will fetch data from SQL Server database using LINQ and display that data in Silverlight, while we are following ASP.Net MVC Framework.

Step 1:

  • Create a Silverlight application.
  • File ⇒ New ⇒ Project  ⇒ SilverLight
  • Give a meaningful name. Here name is SilverLight in MVCFramework.

Step 2:

  • Hosting Silver Light application.
  • There are three options available for hosting a Silverlight application.  Select ASP.Net MVC Web project.  Then after ,Select option NO for creating UNIT Test Project.

Step 3:

  • Right click on Controller.
  • Click on Add-> New Item and select add LINQ to SQL classes.
  • Give a name, here name is Test.dbml

Step 4:

Here, I have already created a TEST data base in my database.  I am going to display data from this database.

  • Open Server Explorer
  • Right click on  Data Connection
  • Click Add New Data Connection.
  • Now give a Server name and select database to connect. In my case name of database is Test.

Expand test.dbo. Here there are 2 tables in Test database.  One is Test_Details and other is test sample.  In this tutorial, I am going to display data from Test_Detatils table. So select this table from Server explorer and drag it on Test.dbml page.

Now if you click on Test.Dbml.CS file. You will find code has been created for you. Code is as follows. You don’t need to write this code. It has been already created once you drag table from server explorer to Test.Dbml page.Test.Dbml.CS 

#pragma warning restore 1591

Up to this step, Linq class has been created.

Step 5:

  • Click on Controller and select HomeController.  You will see code window for HomeController.
  • Right now this is containing two actions called Index and About.

Note : Methods inside a controller is called action. For details on the same , see other articles.

Step 6:

We will add here one more action called List inside Home Controller. Purpose of this action is to fetch out all records of Test_Details table and return List of records as JSON.

Note : For different return types from Action see other articles.

  • Add following code  in Home Controller class.  Don’t forget to include at the top of HomeController.cs

The above action List is returning JSON of all the records fetch from Test_Dtails table of Test Database. So now the complete code of HomeController.cs will look like :

 Step 7:

  • Now click on
  • View  Home  Right Click  Add  View
  • Give name of the View exactly of action name.  Here action name is List so name of view will be List.  Leave other things as default and click on Add. It will create a List.aspx page.

List.aspx will have following code.

Here at value property of source, name is SilverLightMvcTest.xap . Here make sure you are giving the name, which name you gave to your SilverLight Project at Step 1:

So now complete code for List.aspx would be

List.aspx

 Step 8:

Copy paste the below code in Page.Xaml.CS file.

  • Now click on
  • View  ToolBox
  • Drag DataGrid and drop it after Button element of Xaml.  After dragging complete code of Page.xaml.Cs file would be like below

Page.Xaml.cs

I have given name of DataGrid as MyGrid and for button as b1.

Step 9:

  • Click on SilverLight Project and add new class . Give it name Test_Details.
  • Add following code in Test_Details.cs

Make sure here property name and return type is exactly same of the column name and types in table of database.

Step 10:

  • Run your application, by clicking F5.
  • Below screen will come
  • Click on address bar and type http://localhost:2675/home/list
  • Copy this URL.

Step 11:

  • Add a reference to System.RunTime.Serilization and System.ServiceModel.Web  to SilverLight Project.
  • Include namespace to Page.Xaml.Cs

  •  Point to note in above code is
  • In line _client.OpenReadAsync(new Uri(“http://localhost:2675/home/list”));

As the parameter of URI, paste that URI which we copied at step 10 C.

  • Now Run this by pressing F5, you will get the output, when you click on Button.
  • Output after clicking on Button

How to use attached Zip File?

  • Step 1: Download
  • Step 2: Unzip
  • Step 3: create a table in database called Test_Details  with structure explained above
  • Step 4: see on which port number, Silverlight application is running.

Let , if it is running on port number 2689.

Change the code in  Page.Xaml.Cs file With _client. OpenReadAsync (new Url(“http://localhost:2689/home/list”));

It will run 🙂