Microsoft KB Archive/937094

= How to use Visual Studio 2005 to create an ASP.NET 2.0 Web application that uses drop-down lists for users to edit data =

Article ID: 937094

Article Last Modified on 12/3/2007

-

APPLIES TO


 * Microsoft .NET Framework 2.0
 * Microsoft Visual Studio 2005 Team Suite
 * Microsoft Visual Studio 2005 Team Edition for Software Architects
 * Microsoft Visual Studio 2005 Team Edition for Software Developers
 * Microsoft Visual Studio 2005 Team Edition for Software Testers
 * Microsoft Visual Studio 2005 Tools for the Microsoft Office System
 * Microsoft Visual Studio 2005 Standard Edition
 * Microsoft Visual Studio 2005 Professional Edition

-



INTRODUCTION
This article describes how to use Microsoft Visual Studio 2005 to create an ASP.NET 2.0 Web application that uses drop-down lists for users to edit data. By default, the data appears in a text box when a user edits the data. However, when the data appears in a text box, the user may type incorrect data.

Consider the following scenario:
 * The data source is a database table that contains the following fields:
 * ID
 * department
 * name
 * You bind the data source to a GridView control in an ASP.NET Web application.
 * You enable editing so that users can update data in the database table.
 * A user views the Web page and clicks Edit to update a record.

In this scenario, the user may type incorrect data in the field. For example, the user may spell the department data or the name data incorrectly.

To avoid this issue, you can use a drop-down list to display the valid data for a field.



MORE INFORMATION
You can create a Web application that uses drop-down lists for editing fields. To do this, follow these steps.

Note This example uses the PUBS database that is included with Microsoft SQL Server 2000 as the data source. However, you can use any data source.  Create a Web application project. To do this, follow these steps:  Start Visual Studio 2005. Click File, point to New, and then click Project. Expand Visual Basic, click Web, and then click ASP.NET Web Application. Type a name for the Web application, and then click OK.  Add a SQLDataSource object to the project, and then configure the object. To configure the SQLDataSource object, follow these steps:  Right-click the SQLDataSource object, and then click Configure Data Source. The Configure Data Source wizard opens.</li> In the Configure Data Source wizard, configure the SQLDataSource object to connect to the PUBS database, and then click Next two times.</li> Click Specify columns from a table or view, and then click authors in the Name box.</li> Click to select the * check box.</li> Click Advanced, click to select the Generate INSERT, UPDATE, and DELETE statements check box, click OK, and then click Next.</li> Verify that SELECT * FROM [authors] appears in the SELECT statement box, and then click Finish.</li></ol> </li> Add a GridView control to the project, and then configure the control. To configure the GridView control, follow these steps:  In the GridView Tasks flyout panel, configure the GridView control to use the SQLDataSource that you added in step 2.</li> In the GridView Tasks flyout panel, click to select the Enable Editing check box.</li></ol> </li> On the Debug menu, click Start Debugging.</li> Click Edit to edit one record in the database table. Notice that a text box appears for each field.</li> Add another SQLDataSource object to the project, and then configure the object. To configure the SQLDataSource object, follow these steps:  Right-click the SQLDataSource object, and then click Configure Data Source. The Configure Data Source wizard opens.</li> <li>In the Configure Data Source wizard, configure the SQLDataSource object to use the same database connection that you used in step 2b, and then click Next.</li> <li>Click Specify columns from a table or view, and then click authors in the Name box.</li> <li>Click to select the state check box, click to select the Return only unique rows check box, and then click Next.</li> <li>Verify that SELECT DISTINCT [state] FROM [authors] appears in the SELECT statement box, and then click Finish.</li></ol> </li> <li>In the GridView Tasks flyout panel for the GridView control, click Edit Columns. The Fields dialog box appears. <ol style="list-style-type: lower-alpha;"> <li>In the Fields dialog box, click state under Selected field.</li> <li>Click Convert this field into a TemplateField, and then click OK.</li></ol> </li> <li>In the GridView Tasks flyout panel, click Edit Templates.</li> <li>In the GridView Tasks flyout panel, click EditItemTemplate in the Display box.</li> <li>Delete the text box that appears under EditItemTemplate.</li> <li>Add a DropDownList control to the template, and then configure the control. To configure the data source for the DropDownList control, follow these steps: <ol style="list-style-type: lower-alpha;"> <li>In the DropDownList Tasks flyout panel, click Choose Data Source. The Configure Data Source wizard opens.</li> <li>In the Configure Data Source wizard, click to select the SQLDataSource object that you added in step 6, and then click OK.

Note State must appear in the Select a data field to display in the DropDownList box and in the Select a data field for the value of the DropDownList box.</li></ol> </li> <li>Configure the data bindings for the DropDownList control. To do this, follow these steps: <ol style="list-style-type: lower-alpha;"> <li>In the DropDownList Tasks flyout panel, click Edit DataBindings. The DropDownList Databindings dialog box appears.</li> <li>In the DropDownList Databindings dialog box, click SelectedValue under Bindable properties.</li> <li>Click to select Field binding, click state in the Bound to box, and then click OK.</li></ol> </li> <li>On the Debug menu, click Start Debugging.</li> <li>Click Edit for one of the records. Notice that a drop-down list appears for the state field.</li></ol>

<div class="references_section">