Multi Paged Silverlight application consuming ADO.Net Data services

Multi Page Silverlight Application with ADO.NET Data Services – Insert, Update, Delete operations

This article demonstrates how to create a multiple paged Silverlight Application for Insert, Update and Deletion of data exposed by ADO.Net Data Services.

Step 1: We will first create an ADO.Net Data Services application and expose the Northwind DataBase.

Step 2: Create a Multiple Page application with the button to move Next and Previous pages.

Step 3: Orders and Order_Details table will be loaded in the DataGrid in the first page.

Step 4: Clicking “Insert” button will move to next page that will contain a blank form to insert the new row in Order or Order_Details table.

Step 1

1. Create a new ASP.Net web site.
2. Select to add a new item and select “ADO.Net Data Entities”.
3. Select Data from the SQL Server and select all the Tables from Northwind database.
4. Again add a new item and select “ADO.Net Data Services”.
5. Expose all the Tables of Northwind database by changing the DataContext type to “NorthwindEntities” and set the config.SetEntitySetAccessRule(“*”, EntitySetRights.All)
6. Host this web site in IIS.

Step 2

1. Create a new Silverlight application and add an ASP.Net web site to host the Silverlight application.
2. Select to add a new item and select new user control. Name it, Switcher.xaml.
3. Repeat step 2 and this time provide a name, “Page2.xaml”.
4. Open App.Xaml.VB file and in the Application startup event, change the instance from New Page1() to New Switcher();
5. Open the Switcher.Xaml.vb file and in the initialize method, set me.content=new Page1()
6. In the same file, add a new public method called SwitchPage which accepts UserControl as a parameter.
7. In this method, set me.content = parameterName;
8. Add a button to Page1.Xaml as well as Page2.xaml. In the click event of these buttons, make a call to the SwitchPage method of the Switch Class. We can get the reference of the Switch class by using Me.Parent as Switcher is the parent of both Page1 and Page2. In the SwitchPage method pass the instance of the other page.

Below is the listing of the App.Xaml.Vb Switcher.Xaml.Vb, Page1.Xaml.Vb and Page2.Xaml.Vb files

 

App.Xaml.Vb

Private Sub Application_Startup(ByVal o As Object, ByVal e As StartupEventArgs) Handles Me.Startup

‘Me.RootVisual = New Page()

Me.RootVisual = New Switcher()

End Sub

Switcher.Xaml.Vb

Public Sub New

        InitializeComponent()

        If Me.Content Is Nothing Then

            Me.Content = New Page1()

        End If

End Sub

Public Sub PageSwitcher(ByVal Nextpage As UserControl)

        Me.Content = Nextpage

End Sub

Page1.Xaml.Vb

Private Sub Button_Click(ByVal sender As System.Object, ByVal e As RoutedEventArgs)

        Dim swtch As Switcher = Me.Parent

        swtch.PageSwitcher(New Page2())

End Sub

Page1.Xaml.Vb

Private Sub Button_Click(ByVal sender As System.Object, ByVal e As RoutedEventArgs)

        Dim swtch As Switcher = Me.Parent

        swtch.PageSwitcher(New Page1())

End Sub

 

Step 3

1. Open Page1.xaml and from the toolbox drag and drop the DataGrid.
2. Set the AutoGenerateColumns of DataGrid to true.
3. Set x:Name to GridEmployees
4. Set ItemsSource to “{Binding}”
5. Add a Button in the Page1.Xaml and name it btnAdd, set the content to “Add New Employee” and add a click event handler named Button_Click
6. Open Page1.Xaml.Vb.
7. Define a global level variable

Dim NwindService As NorthwindEntities

Dim curApp As App

1. In the Constructor, after the InitializeComponent(), initialize the NwindService and curApp

curApp = Application.Current

NwindService = curApp.NwindService

1. Define a DataServiceQuery to fetch the EmployeeSet

Dim dsq As DataServiceQuery(Of Employee) = From emp In NwindService.EmployeeSet Select emp

10.  Make a call to the BeginExecute method of the DataServiceQuery

dsq.BeginExecute(New AsyncCallback(AddressOf DataLoadComplete), dsq)

11.  Declare the DataLoadComplete method

Private Sub DataLoadComplete(ByVal ar As IAsyncResult)

Dim dsq As DataServiceQuery(Of Employee) = ar.AsyncState

GridEmployees.DataContext = dsq.EndExecute(ar).ToList()

            End Sub

12.  Define the Button_click event to PageSwitcher method of the Switecher class. For this, first get the reference of the Switcher class by using Me.Parent . Also generate the next employee id to be passed as a parameter to the constructor of the Page2 class.

Dim swtch As Switcher = Me.Parent

Dim emps As List(Of Employee) = CType(GridEmployees.DataContext, List(Of Employee))

Dim EmpIDs As Integer = (From id In emps Order By id.EmployeeID Select id.EmployeeID).Last()

swtch.PageSwitcher(New Page2(EmpIDs + 1))

13.  Open Page2.Xaml and place the 4 TextBlock and 4 TextBoxes for EmployeeId, FirstName, LastName and Country. Place a button and attach a click event.

14.  Open the Page2.Xaml.Vb. Declare the global label variables NwindService and curApp similar to  Page.Xaml.Vb and declare a new constructor that takes NewEmployeeId as Integer as parameter.

Public Sub New(ByVal NewEmpId As Integer)

InitializeComponent()

TxtEmploeeID.Text = NewEmpId.ToString()

curApp = Application.Current

NwindService = curApp.NwindService

End Sub

15.  In the Button’s click event define the code to call the AddToEmloyeeSet method of the NwindService and call the BeginSaveChanges method.

Private Sub AddEmp_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs)

NwindService.AddToEmployeeSet( _

New Employee() With {.EmployeeID = TxtEmploeeID.Text, _

.FirstName = TxtFirstName.Text, _

.LastName = TxtLastName.Text, _

.Country = TxtCountry.Text})

NwindService.BeginSaveChanges(New AsyncCallback(AddressOf Employee_added), Nothing)

End Sub

16.  Define the Employee_added method and call the EndSaveChanges method of the NwindService in the try catch block. Finally make a call to the PageSwitcher method of the Switcher class to go back to Page1

Public Sub Employee_added(ByVal res As IAsyncResult)

Try

NwindService.EndSaveChanges(res)

Catch ex As Exception

End Try

Dim swtch As Switcher = Me.Parent

swtch.PageSwitcher(New Page())

    End Sub