The intent of this series is to provide more information concerning the functionality and limitations of the available ASP.NET 2.0 data controls. This will mostly be demonstrated through the use of code samples. Once this series is complete, I will demonstrate how one can AJAX enable some of these samples to improve the overall user experience. Therefore, this series will address the basics first before moving onto more advanced tools. Many will feel that there is enough information available concerning these matters. However, for completeness sake, I feel it is important to provide a good foundation from which to launch future articles from. The articles in this series will address typical scenarios that one might encounter in terms of developing with ASP.NET data controls.
There will be three parts in this series:
- Part 1 – ASP.NET GridView
- Part 2 – ASP.NET FormView and DetailsView
- Part 3 – ASP.NET Repeater and DataList
The SqlDataSource control is used throughout the series for simplicities sake.
Part 2 - ASP.NET FormView Data Control
This is the second article in a three part series of articles pertaining to the understanding and application of ASP.NET 2.0 data controls. This article will address common functionality that may be required from ASP.NET FormView data controls.
Level: Novice - Intermediate
- In order for the sample code to run, one will require the Pubs database running on either SqlExpress or Sql2005.
- An understanding of C# and ASP.NET development code
Please download the code here
Based on various Microsoft documentation, the ASP.NET FormView can be summarised as follows.
Displays the values of a single record from a data source using user-defined templates. The FormView control allows you to edit, delete, and insert records. It is similar to the DetailsView control, except it displays user-defined templates instead of row fields.
The FormView control supports the following features:
- Binding to data source controls, such as SqlDataSource and ObjectDataSource.
- Built-in inserting capabilities.
- Built-in updating and deleting capabilities.
- Built-in paging capabilities.
- Programmatic access to the FormView object model to dynamically set properties, handle events, and so on.
- Customizable appearance through user-defined templates, themes, and styles.
For this example, a SqlDataSource is used to retrieve a list of authors from the database. A FormView will be used to display Author information. For each Author, a list of book titles is loaded into a GridView data control. The Titles GridView is nested within the FormView data control as a master/detail setup. The FormView behaving as the master and the Tiels GridView as the detail. Also, one is able to open a modal dialog displaying publisher information that an Author is related to. It is alos possible to add a new Title to an author from the Author FormView data control. Therefore, not only does the Author FormView have a GridView nested within it, but also another FormView data control. The whole point of this exercise is to highlight how easy it is to provide rich edit functionality using the FormView data control.
We will be using the SqlDataSource as a data provider in this example. The example will demonstrate the following features:
- Bind FormView to a SqlDataSource (It should be noted that I only use the SqlDataSource for demonstration purposes. I favour the ObjectDataSource over the SqlDataSource in terms of the development I have been involved in)
- Search data using a query statement, ASP.NET control parameters, and ASP.NET controls (TextBox and DropDownList) as the input
- Edit and Update behaviour with the ASP.NET RequiredFieldValidator and CompareValidator controls.
- Delete with confirmation dialog
- Master/Details using a modal dialog
- Master/Detail between FormView (master) and GridView (detail)
- Using the DataBound event
- Implement custom Paging
Note: Please refer to the solution code concerning the following scenarios.
Bind FormView to a SqlDataSource
For this example, a SqlDataSource is used as the FormView data source. The FormView DataSourceID is set to the id of the SqlDataSource. Because paging functionality will be demonstrated, AllowPaging is set to true. The DataKeyNames property is used as a primary key/s (value that uniquely identifies a record) and is set to the author id (au_id).
The OnModeChanged event is used to determine what mode the Author FormView data control is in. In this case we use it to determine whether the Author FormView is in edit or insert mode. If it is, the Search Panel is disabled.
The result from binding to the SqlDataSource is demonstrated as follows.
This example demonstrates how to search data within the context of a FormView control
The following code highlights the setup for the ASP.NET controls that are used as part of the search.
This is the ASP.NET code required for the setup of the Search Panel
The result is as follows.
The Author FormView SqlDataSource is setup as follows to retrieve data based on search criteria. ASP Control Parameters are used as Select parameters
The SQL Select command is setup as follows.
SelectCommand="SELECT DISTINCT A.* FROM [Authors] A LEFT JOIN [TitleAuthor] TA ON A.au_id = TA.au_id LEFT JOIN [Titles] T ON TA.title_id = T.title_id LEFT JOIN Publishers P ON T.pub_id = P.pub_id WHERE (A.au_lname like '%' + @author + '%' OR A.au_fname like '%' + @author + '%' OR @author = '') AND (P.pub_name LIKE '%' + @publisher + '%' OR @publisher = '') ORDER BY A.au_lname ASC"
One can search by Author AND/OR Publisher. The results are as follows.
Edit and Update behaviour with the ASP.NET RequiredFieldValidator and CompareValidator controls
For this scenario please refer to the solution code.
The point of this scenario is to illustrate how one might nest data controls in order to achieve rich edit functionality. In this scenario, a FormView (New Title) and a GridView (Title Detail) is nested within a FormView (Author Detail).
The following screen shot illustrates that when a record is in edit mode; all author detail is required and cannot be left empty. If an attempt is made to update the row, a client-side validation event is raised to indicate that the author fields are required. It should also be noted that the Title GridView now provides an edit option. Also, one is able to add a new Title from this point.
The code to setup the Command Buttons to put the FormView in Edit or New mode is demosntrated as follows. Take note of the CommandName property.
Edit an Author
Edit Title for Author
Add new Title
Delete with confirmation dialog
Unfortunately, there is no setting that one can enable to allow one to have a confirmation dialog popup should a delete action be initiated. The following snippet demonstrates a way that one might use to create this kind of behaviour.
The resultant behaviour is as follows.
Master/Details using a modal dialog
The result is as follows.
Master/Detail between FormView (master) and GridView (detail)
For each Author record that is retrieved, a GridView will be loaded with titles that have been authored according to the author id. The Author FormView behaves as the Master providing the AuthorId.
Please refer to the solution code for this example.
Implement custom Paging
It is possible to provide rich paging functionality by editing the PagerTemplate of the FormView. The following code snippets illustrate how this is achieved. Please refer to the following code in the actual code solution.
The following code illustrates the ASP.NET settings required to implement a custom paging template. Please take note of the ‘CommandArgument’ and ‘CommandName’ attributes.
The result of the aforementioned code is illustrated in the image below.
That’s it for Part 2 of ASP.NET data controls. Part 3 will address the ASP.NET DetailView and Repeater data controls.