This tutorial will demonstrate step by step how to display, edit, delete, page and sort data using the ListView control. C#
In this tutorial we will demonstrate how the ListView control supports edit, insert, delete, sort and page functionality. We will be working with templates because they allow you to have complete control over the layout and appearance of the data in the control.
Here is a snapshot of how the ListView should appear:
To start, we will need to create a Web site. Open Visual Studio 2008; File > New > Web site > ASP.NET Web site and name it ListView or whatever you want.
Need help with Windows Dedicated Hosting? Try Server Intellect I'm a happy customer!
Switch to Design View. From the Data tab of the Toolbox, drag a ListView control over to the default.aspx page. Now, from the “Common ListView Tasks” menu (small tab in upper right hand corner of ListView control), choose the Data Source drop-down list, and click “New Data Source”. The Data Source Configuration wizard should be displayed. Then choose Database, click OK.
Now under “which data connection should your application use to connect to a database?”, select your database that you want to use. In this example we have a database called People. Click Next.
Then choose which elements you would like to display. Click Finish.
Next, switch back to the Design View and right-click on the ListView control, click “Show Smart Tag”, then from the Common ListView Tasks menu, click “Configure ListView”. A configure ListView dialog box should appear, click “Enable paging”.
The Wizard creates the templates for the ListView control, based on the columns in the query. You can also customize the layout by editing the templates that contain the layout elements, controls, and binding expressions. For this example, we opted to use a “Grid” layout, and choose a “professional” theme.
Save and Run. Remember! Once the number of records will exceed the PageSize of the DataPagers (that will be automatically inserted into ListView when you will select Enable Paging from the Configure ListView dialogue box) First, Previous, Next and Last button at the bottom will be enabled automatically. It should look similar to this example:
Add Sorting to your ListView Control
In the default.aspx file, switch to Source View.
Normally, you are able to modify the templates for the ListView control by using the designer, except for layouts based on tables, such as Grid, you must change the code manually.
Now locate the LayoutTemplate element inside the ListView control. Just above the DataPager control markup code, drag two button controls onto the default.aspx page (Source View). Set the properties as follows:
First Button Properties:
Text property=”Sort by Name”, CommandName property=”Sort”, CommandArgument property=”Name”
Second Button Properties:
Text property=”Sort by ID”, CommandName property=”Sort”, CommandArgument property=”id”
If you're ever in the market for some great Windows web hosting, try Server Intellect.We have been very pleased with their services and most importantly, technical support.
The button’s CommandArgument properties are set to a sort expression. For database data, this is normally the name of a column.
This tutorial gives you the basic steps for using a ListView control to display, edit, page, and sort data records by using one of the layouts provided for the control.
|
|