CRUD operations using the List View Web Server Control

Introduction

Using the ASP.NET ListView Control we can insert,edit, or delete records without writing any code. This post explains how to display and update data using the ListView control. We will use SqlDataSource control to retrieve results from the data source and act as the data source for the ListView control.

1. Create a web site in visual studio 2008 by selecting the File menu, click new

    web site option the following dialogue box will appear

 

2. Enter the name for the web site and say ok.

3. To display and modify the data in listview control add the database file to the

    App_Data folder. Here i am adding the Department table of AdventureWorks

    database.

4. Open the design view of the default.aspx file and add the Listview control

    from the datasection in the toolbox.

5. Configure the datasource for the listview control by choosing the <New data

    source…> from the Choose Data Source drop-down list.

 

6. Select the database from the dialogue box and say ok.

7.

8. select the connection string and click next

9. It saves the connection string in web.config file.

 

10.  

11. Select the Specify a custom SQL statement or stored procedure option from the above dialogue box.

 

12.  

13. Enter the following SQL query to retrieve the data from the Select tab

 SELECT  DepartmentID, Name, GroupName
FROM    HumanResources.Department

14. Click the update tab and enter the following query

UPDATE HumanResources.Department 
SET    Name = @Name, GroupName = @GroupName 
WHERE  (DepartmentID = @Department

15. Click the insert tab and enter the following query to insert 

       data in to department table.

INSERT INTO HumanResources.Department(Name, GroupName)
VALUES (@Name, @GroupName)

16. Click the delete tab and enter the following SQL query

DELETE FROM HumanResources.Department WHERE (DepartmentID = @DepartmentID)

17. Click next and click Test Query to test the data is retrieving.

18. Configure the listview control options as shown in the following dialogue box

19. Click Ok. The configured Listview control might look like the following

20. Run the application you will see the following output