Advertisment

Develop Business Apps with Silverlight 3

author-image
PCQ Bureau
New Update

Last month, we looked at how you can create a business application using

Silverlight 3 and a WCF service to talk to and from a database hosted on the

server. This method is quite okay when creating a simple business application

that needs to talk to the database to retrieve or modify the data in it.

However, real world business applications would require to scale up much higher

and this is where an n-tier scalable architecture comes in handy. The n-tier

architecture allows you to put different parts of the system on different pieces

of hardware to be able to quickly scale up to meet business requirements. You

can quite easily create a Silverlight 3 business application using the .NET RIA

Services SDK from Microsoft.

Advertisment

Direct Hit!

Applies To: Developers



USP: Create real world business apps
using .NET RIA Services



Primary Link:
http://tinyurl.com/dcs3fj



Keywords: Silverlight 3, .NET RIA
services


To create an n-tier Silverlight 3 application, you need to have the .NET RIA

Services SDK downloaded and installed alongside the Silverlight 3 SDK. Once this

is done, open VS2008 or VWD2008 and create a new Silverlight project. When the

dialog box to create a Web project comes up, you will see a new option saying

'Enable .NET RIA Services'. Turn this on to get the



new features for scaling up your application.

Starting with .NET RIA Services



When the project comes in, it will look exactly like a normal Silverlight 3

project. Let's now create a service layer that will allow the Silverlight

application in the browser to communicate with the server. First you create a

new LINQ to SQL class that connects to the tables in the database you wish to

work with. Here, I'm using the standard Northwind database and the Products,

Suppliers & Categories table. Compile the Web project once to build the

DataContext for the LINQ and then add a new item of the type Domain Service

Class. When you create the class, you will be presented with a configuration

dialog. Make sure you enable client access for all the entities. Also check the

add, edit and delete features turn on for each entity. Finally, also turn on the

metadata generation option (we'll use this a little later). This adds a new

class (and a metadata class) that exposes the entities.

Advertisment

Open up the domain service class that you just created. You will see that the

class has four methods for each entity that you have selected in the previous

step — Get, Insert, Update and Delete. The last 3 are available only if you

choose to enable data editing in the dialog box. Here, we'll go ahead and use

these methods itself. However, in most real world cases, you would want to

modify or add new methods for different scenarios. We will do a minor

modification to the GetProducts to see the effect. Simply change the line to

read:

return this.Context.Products.OrderBy(e => e.ProductName);

Turn on the option ( as shown

above) to enable RIA Services when creating a Silverlight project.
When creating a DomainService

class you must enable the entities, their editing and metadata generation.
Advertisment

This will ensure that the list of products is always returned sorted by the

name. Now go to the Silverlight project and open the MainPage.xaml file. Drop in

a DataGrid control on the page and configure it like this: .

Open the code-behind file and add the following, using statements as well as the

code that comes next:

Using statements:

using SLRIA.Web;using System.Windows.Ria.Linq;

Advertisment

Main Code:



NWDomainContext nw = new NWDomainContext();


public MainPage(){ InitializeComponent(); dgData.ItemsSource = nw.Products;
nw.Load(nw.GetProductsQuery());}

Run the page to see the data in the Products table being displayed in the

Silverlight DataGrid control. Note that you can sort (on multiple columns using

the Shift key), re-order and resize columns without requiring any changes.

Displaying data from related tables



Now, let's make some changes to the code to not only display the products,

but also the name of the supplier (from the Suppliers table) and category (from

the Categories table). For this, first open the metadata file in the Web project

and add a new directive '' above the members that point to the

respective objects like this:

Advertisment

public Category Category;...public

Supplier Supplier;

Now open the main domain service class and change the GetProducts method as

follows:

public IQueryable GetProducts(){

DataLoadOptions loadOpts = new DataLoadOptions(); loadOpts.LoadWith(p

=> p.Category); loadOpts.LoadWith(p => p.Supplier);

this.Context.LoadOptions = loadOpts; return this.Context.Products;}

Advertisment

The LoadWith statements return the category and supplier data, along with the

product data to the client and can be accessed in the Silverlight XAML using

standard .NET dot-notations to show the name of the product, category and

supplier company in the DataGrid like this:



Binding="{Binding ProductName}" /> Binding="{Binding Supplier.CompanyName}" /> Header="Category" Binding="{Binding Category.CategoryName}" /> ...

The grid is now enhanced with an

auto-type filter and a pager.
A simple Silverlight-based

application that shows data from 3 related tables.
Advertisment

Using the DomainDataSource Control



The great part about RIA services is that you don't need to write much

backend code to get a number of cool features — all that you need to do is

adding some controls to the XAML and configuring them. The main such control is

the DomainDataSource control that you add to the page. First, remove all the

code that was added to the MainPage.xaml.cs file above. Next, in the toolbox of

VS/VWD add a new item and select the DomainDataSource control, and then once, it

appears in the toolbox, drag and drop it above the DataGrid control. Also add

the following namespaces to the top of the page:

xmlns:ds="clr-namespace:SLRIA.Web"xmlns:riaData="clr-namespace:System.Windows.Data;assembly=System.Windows.Ria.Controls"

Change the DomainDataSource control you added earlier to look like this:

AutoLoad="True" QueryName="GetProducts">

And add the ItemSource attribute to the DataGrid to point to this data

source:

ItemsSource="{Binding Data, ElementName=prodDataSource}">

Running the page now will display same data as before, but without any

backend code. The DomainDataSource control also allows you to add filters,

sorting and paging capabilities into it. For this, first add a new TextBox

control named 'txtNameFilter' before the grid and then add the following inside

DomainDataSource:

LogicalOperator="And"> Operator="Contains"> PropertyName="Text" RefreshEventName="TextChanged" />

You can also add a DataPager control below the grid to add paging

capabilities like this:

Running the application now will allow you to see the data from different

tables in the grid. The records shown are only 10 per page and you can use the

pager at the bottom of the grid to navigate the records.

Finally, you can even filter the records by typing in a few characters of the

name in the text box and as you type, the rows will be automatically filtered.



As you can see, the RIA Services allows you to perform a large number of
business / data related work very easily. Next month, we'll take a look at how

you can add, modify and delete data from this table as easily as this.

Advertisment