As we saw in our prevoius example WCF Ria Services provide us with a clean and simple way of binding our control to our data model . Now lets go one step further I would like to design a Complete User Page using WCF Ria Services . Lets get started . Create a new page NewPage.xaml . Go to the Data Source. Select the Associated Control as ComboBox . Click ok . and the icon changes to combo box as shown below : Simply Drag and Drop the Article Id on to the NewPage.xaml . The Design Page should now look as below : Modify the App.xaml to make the NewPage.xaml as the start up and give it a run . Now go back to the Data Source . select Title and customize . Select the Associated Control as TextBlock . Click Ok and the icon changes to TextBlock . Drag and Drop both to the designer area . Build and Run it . Title and Body corresponding to the article id are displayed . Modify the article Id . Title and Body are modified as shown below : Behind the scene this was the code that was generated . Wow now that would have been tough . Thanks to WCF Ria Services we were saved . All the Binding work was taken care for you by Ria services Support . <UserControl x:Class="SLWCFRiaServices.NewPage" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d" d:DesignHeight="300" d:DesignWidth="400" xmlns:riaControls="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.DomainServices" xmlns:my="clr-namespace:SLWCFRiaServices.Web" xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk">
<Grid x:Name="LayoutRoot" Background="White"> <riaControls:DomainDataSource AutoLoad="True" d:DesignData="{d:DesignInstance my:Article, CreateList=true}" Height="0" LoadedData="articleDomainDataSource_LoadedData" Name="articleDomainDataSource" QueryName="GetArticlesQuery" Width="0"> <riaControls:DomainDataSource.DomainContext> <my:DataDomainContext /> </riaControls:DomainDataSource.DomainContext> </riaControls:DomainDataSource> <Grid DataContext="{Binding ElementName=articleDomainDataSource, Path=Data}" HorizontalAlignment="Left" Margin="56,29,0,0" Name="grid1" VerticalAlignment="Top"> <Grid.ColumnDefinitions> <ColumnDefinition Width="Auto" /> <ColumnDefinition Width="Auto" /> </Grid.ColumnDefinitions> <Grid.RowDefinitions> <RowDefinition Height="Auto" /> </Grid.RowDefinitions> <sdk:Label Content="Article ID:" Grid.Column="0" Grid.Row="0" HorizontalAlignment="Left" Margin="3" VerticalAlignment="Center" /> <ComboBox DisplayMemberPath="ArticleID" Grid.Column="1" Grid.Row="0" Height="23" HorizontalAlignment="Left" ItemsSource="{Binding Mode=OneWay}" Margin="3" Name="articleIDComboBox" VerticalAlignment="Center" Width="120"> <ComboBox.ItemsPanel> <ItemsPanelTemplate> <VirtualizingStackPanel /> </ItemsPanelTemplate> </ComboBox.ItemsPanel> </ComboBox> </Grid> <Grid DataContext="{Binding ElementName=articleDomainDataSource, Path=Data}" HorizontalAlignment="Left" Margin="56,95,0,0" Name="grid2" VerticalAlignment="Top"> <Grid.ColumnDefinitions> <ColumnDefinition Width="Auto" /> <ColumnDefinition Width="Auto" /> </Grid.ColumnDefinitions> <Grid.RowDefinitions> <RowDefinition Height="Auto" /> </Grid.RowDefinitions> <sdk:Label Content="Title:" Grid.Column="0" Grid.Row="0" HorizontalAlignment="Left" Margin="3" VerticalAlignment="Center" /> <TextBlock Grid.Column="1" Grid.Row="0" Height="23" HorizontalAlignment="Left" Margin="3" Name="titleTextBlock" Text="{Binding Path=Title, Mode=TwoWay}" VerticalAlignment="Center" /> </Grid> <Grid DataContext="{Binding ElementName=articleDomainDataSource, Path=Data}" HorizontalAlignment="Left" Margin="60,162,0,0" Name="grid3" VerticalAlignment="Top"> <Grid.ColumnDefinitions> <ColumnDefinition Width="Auto" /> <ColumnDefinition Width="Auto" /> </Grid.ColumnDefinitions> <Grid.RowDefinitions> <RowDefinition Height="Auto" /> </Grid.RowDefinitions> <sdk:Label Content="Body:" Grid.Column="0" Grid.Row="0" HorizontalAlignment="Left" Margin="3" VerticalAlignment="Center" /> <TextBlock Grid.Column="1" Grid.Row="0" Height="23" HorizontalAlignment="Left" Margin="3" Name="bodyTextBlock" Text="{Binding Path=Body, Mode=TwoWay}" VerticalAlignment="Center" /> </Grid> </Grid> </UserControl> In the next post we will learn about some advanced features of WCF RIA Services . Till Then . Happy Coding .
You need to be a premium member to use this feature. To access it, you'll have to upgrade your membership.
Become a sharper developer and jumpstart your career.
$0
$
. 00
monthly
For Basic members:
$20
For Premium members:
$45
For Elite members: