Beginner's Guide to Work With Azure Table Storage and Silverlight Episode 1

In This Tutorial we will Create a Single Entity Azure Table named Student with Silverlight Client performing CRUD Operation on the table.

• In the First Step Create a Cloud Service with an ASP.net MVC 2 Project:

• As you Press OK following Dialog Will be displayed.

• Double Click on ASP.NET MVC 2 Web Role this will add ASP.NetMVC role in right Pane. Rename it to StudentRole.

• On the next Screen Select "No Do not Create Test Project" Option on the next Screen. As the Project Creation Completed Test it by hitting key F5. Following Screen will be displayed which is part of MVC Template and Created by the wizard as you chose MVC project.

• Now  Add Silverlight Navigation Application Project into the solution and name it AzureTableClient.

 

• When you will press OK button following dialog will be displayed Uncheck the Option "Make it the Start Page".

• As you further press OK button two files will be Added in MVC Project named "AzureTableClientTestPage.aspx and AzureTableClientTestPage.html". Open file AzureTableClientTestPage.html and Press Ctrl + A to Select all then Ctrl + C to Copy.
• Now in  Expand Views folder in MVC Project and then expand Home Folder.

• Now open Index.aspx file and except first line delete every code it have now paste the code you copied from AzureTableClientTestPage.html
• Now in the first line of Index.aspx Delete "MasterPageFile" Attribute since our Client Application will be in Silverlight therefore we don't need master page. Also change the path of Silverlight.js file in Script Tag to

<script type="text/javascript" src="../../Silverlight.js"></script>

• Now we are good to Test Our Project as Silverlight Application is embedded in default View of MVC Application. Hit F5 to Test the Application.
  

• As Silverlight runs on client machine it needs a web service to communicate with web server. Add a WCF Service in MVC Project and name it "StudentService".
• Open "Web.config" and find Endpoint definition Tag and change  value of binding attribute from wsHttpBinding to basicHttpBinding.

  

• In "IStudentService.cs" change the return type of function definition DoWork() to string. e.g string DoWork();
• And change the Implementation of DoWork function in "StudentService.svc" to:

       public string DoWork()
        {
            return "WCF Responded......";
        }

• Press F6 to Build Solution.
• Right Click on Silverlight Project and Select "Add Service Reference" in the dialog press discover button. Enter StudentSvc in Namespace field.

• Add using statement in App.xaml.cs

using AzureTableClient.StudentSvc;

• Add a factory method in App.xaml.cs to create Student Service Client Proxy Object.

         public static StudentServiceClient CreateStudentClient()
        {
            StudentServiceClient svc = new StudentServiceClient();
            svc.Endpoint.Address = new System.ServiceModel.EndpointAddress(new Uri("http://127.0.0.1:81/StudentService.svc"));
            return svc;
        }

• Open Home.xaml.cs in Silverlight Project and add a using statement 

using AzureTableClient.StudentSvc;

• Add these lines in constructor of Home.xaml.cs to Access WCF Service.

            StudentServiceClient svc = App.CreateStudentClient();
            svc.DoWorkCompleted += new EventHandler(svc_DoWorkCompleted);
            svc.DoWorkAsync();

• Add function svc_DoWorkCompleted in Home.xaml.cs.

        void svc_DoWorkCompleted(object sender, DoWorkCompletedEventArgs e)
        {
            if (e.Error == null)
            {
                ContentText.Text = e.Result;
            }
        }

•  To Access WCF from the Cloud Project we need "ClientAccessPolicy.xml" file in the Project where WCF Service is hosted this file can be downloaded from here. 
• Now Hit F5 to Run The Application.

•  In this post We have covered:

• Silverlight Navigation Application hosted in MVC Application.
• Silverlight WCF Communication tested.
• In the next post we will cover 
• Azure Table Entity Creation
• Azure Table Creation
• Operations on Azure Table from Silverlight Client.
  

Download complete code from here