Silverlight tutorial Creating a data centric web app with DataGrid LINQ and WCF Web ServiceWord文档下载推荐.docx

1、7. Drag DataTable onto DataClasses1.dbml 8. Set key as the primary key 9. View properties for DataClasses1.dml. Set the serialization mode to unidirectional so that it is compatible with web services. 10. Okay, that takes care of your database. Now lets set up the web service. Right click on the Wcf

2、SqlDemoWeb project and add a new item. Select the Silverlight-enabled WCF Service template and name it DemoService.svc 11. Delete DoWork method and replace with the two methods below plus the following using references. By the way, the “var selected_rows = from rows in db.DemoTables select rows” stu

3、ff, thats LINQ. Its fantastic. Its a very clean sensible query language that is built into .NET 3.5 that can be used for querying databases, XML, and even collections. One of the easier ways to figure out what link is, is to look at some examples. I recommend Microsofts 101 LINQ Samples . The LINQ l

4、ine that I use in the GetRows method loosely means “Take the table db.DemoTable and assign the elements of that table to the collection rows then select all those rows and assign them to the collection selected rows”. Collapse Copy Code using System.Collections.Generic;using System.Text;and also / R

5、eturn the list of valid dataOperationContractpublic List GetRows（）DataClasses1DataContext db = new DataClasses1DataContext（）;var selected_rows = from rows in db.DemoTables select rows;return selected_rows.ToList（）;/ Insert a new data into the databasepublic void InsertData（string testItem1,string te

6、stItem2）/ Create a new row object.DemoTable row = new DemoTableKey = Guid.NewGuid（）,TestItem1 = testItem1,TestItem2 = testItem2;/ Add the new object to the collection.db.DemoTables.InsertOnSubmit（row）;/ Submit the change to the database.db.SubmitChanges（）;12. Now we need to let our Silverlight clien

7、t know about the web service weve just created. Right click SilverlightClient and select Add Service Reference. Click Discover. VS2008 should find the service from the project. Allow it to be saved in the namespace ServiceReference1. 13. Open page.xaml in ExpressionBlend. Make a form that looks some

8、thing like what Ive created below. Name the text boxes TestItem1TxtBoxand TestItem2TxtBox 14. Now lets add the datagrid into which the data we retrieve from the web service will be placed. The Datagrid control is not a default control of your Silverlight project, so youll have to add it. Right click

9、 on references in SilverlightClient and add a reference to System.Windows.Control.Data. Go to page.xaml. Add the following attribute to the user control element so we can get access to the DataGrid xmlns:my=clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data15. Now you can go

10、 to the asset library and find DataGrid under Custom Controls. 16. Add a DataGrid to the project and size it. Name the grid ResultsGrid. If you look at the XAML it should look similar to the below. 17. Add a button and label it “Get”. The end result should be something like as follows: 18. Add OnGet

11、BtnClicked and OnSubmitBtnClicked to the clicked events of the respective buttons in Expression Blend. This will add the attributes to the XAML button tags and will wake up VS2008 and add the specified methods to the code behind file. 19. Fill in the OnSubmitBtnClick and OnGetBtnClick as shown below

12、. Create a call back to handle the GetRowsCompleted event. （By the way, are you noticing how easy this is? Look at how much is getting done with a few lines of code and look how clean and sensible these few lines are.） private void OnGetBtnClick（object sender, RoutedEventArgs e）DemoServiceClient web

13、Service = new DemoServiceClient（）;webService.GetRowsCompleted +=new EventHandler（webService_GetRowsCompleted）;webService.GetRowsAsync（）;void webService_GetRowsCompleted（object sender, GetRowsCompletedEventArgs e）ResultsGrid.ItemsSource = e.Result;private void OnSubmitBtnClick（object sender, RoutedEv

14、entArgs e）webService.InsertDataAsync（TestItem1TxtBox.Text, TestItem2TxtBox.Text）;20. Build and test. Try submitting a few items and then getting the results. You should see something like the following:21. Easy right? Notice how we didnt even have to do anything to get the DataGrid to display our re

15、sults other than assign our results to the DataGrids ItemsSource. The only down side to this simplicity is that were seeing everything returned including the guid representing the key. Thats not very user friendly. Lets get rid of the auto-generation of columns and create custom ones. Also it seems

16、I needed to add an explicit size to the DataGrid or Id get a funny rendering of the grid when its empty. datagrid margin=8,283,51,85 autogeneratecolumns=False x:name=width=641 height=232DataGridTextColumnHeader=Test Item 1DisplayMemberBinding=Binding TestItem1Test Item 2Binding TestItem2/my:datagrid

17、22. Build and debug. The results should look exactly like before, except this time no column for Key. 23. By now youre probably collecting some garbage in your database, because we have no way to delete any items. Lets change that now. First lets modify our web service to be able to delete items fro

18、m our database. Add the following to DemoService. Note that were using more LINQ. The line below written in LINQ loosely means “Take the table db.DemoTable and assign the elements of that table to the collection rows then select those rows where the key is the passed guid and assign those selected r

19、ows to the collection selectedrow”. / Delete the item specified by the passed keypublic void DeleteRow（Guid key）var selected_row = from rows in db.DemoTables where rows.Key=key select rows;/ Delete the selected rows. There will actual be only one/ item in this collection because the Guid is unique a

20、nd is the/ primary key for the table.db.DemoTables.DeleteAllOnSubmit（selected_row）;24. Add a delete button. When the delete button is clicked will delete whatever item in our DataGrid that was selected. private void OnDeleteClick（object sender, RoutedEventArgs e）DemoTable selectedRow = ResultsGrid.S

21、electedItem as DemoTable;/ Now access the service to delete the itemwebService.DeleteRowAsync（selectedRow.Key）;/ Now refresh the grid25. Rebuild and Debug. Now you can select items and delete them. Tutorial Part 2: Deploying the web app to a remote server25. 1. Publishing the application to the web

22、can be a little difficult. The instructions below have been tried out on my web hosting provider , but youre likely to need to do something similar for other host providers as well. 2. To see the difficulty, publish the website. Now DemoService is located at your server right? All you might think yo

23、u need to do is reconfigure your silverlight client to reference the service at your website. Go ahead and try it. Right click on ServiceReference1 and select Configure service reference. Add the address of the service. In my case it is Youll get the error below and you wont be able to proceed. 3. Heres the work around. Were going to override the way the server creates the Service Host. Add the following class to DemoService.svc.cs public class MyServiceHostFactory : ServiceHostFactory protected override ServiceHost Create