打开 Visual Web Developer。

在“文件”菜单上单击“新建”，然后单击“网站”。如果使用的是 Visual Web Developer 速成版，则在“文件”菜单上单击“新建网站”。

出现“新建网站”对话框。

在“Visual Studio 已安装的模板”之下单击“ASP.NET 网站”。

在“位置”框中选择“文件系统”，然后输入要保存网站网页的文件夹的名称。

例如，键入文件夹名“C:\WebSites\EditData”。

在“语言”列表中，单击您想使用的编程语言。

您选择的编程语言将是网站的默认语言，但您可以为每个页面分别设置编程语言。

单击“确定”。

Visual Web Developer 创建该文件夹和一个名为 Default.aspx 的新页。

在服务器资源管理器中，右击“数据连接”，然后单击“添加连接”。如果使用的是 Visual Web Developer 速成版，请使用数据库资源管理器。

出现“添加连接”对话框。

• 如果“数据源”列表没有显示“Microsoft SQL Server (SqlClient)”，则单击“更改”，并在“更改数据源”对话框中选择“Microsoft SQL Server”。

• 如果出现“选择数据源”页，则在“数据源”列表中选择将要使用的数据源类型。对于此演练，数据源类型为“Microsoft SQL Server”。在“数据提供程序”列表中单击“用于 SQL Server 的 .NET Framework 数据提供程序”，然后单击“继续”。

注意
如果在 Visual Web Developer 中没有显示“服务器资源管理器”选项卡，请在“视图”菜单中单击“服务器资源管理器”。如果在速成版中没有显示“数据库资源管理器”选项卡，请在“视图”菜单中单击“数据库资源管理器”。

在“添加连接”框的“服务器名称”框中，输入您的服务器名称。

在“登录到服务器”部分，选择适合于访问正在运行的 SQL Server 数据库的选项（集成安全性或特定 ID 和密码），如果需要，请输入用户名和密码。如果输入了密码，请选择“保存密码”复选框。

在“选择或输入数据库名称”下输入“Northwind”。

单击“测试连接”，并在确定该连接生效后单击“确定”。

已经在服务器资源管理器的“数据连接”下创建新的连接。

在“网站”菜单上单击“添加新项”。

出现“添加新项”对话框。

在“Visual Studio 已安装的模板”下单击“Web 窗体”，然后在“名称”框中键入“EditEmployees.aspx”。

单击“添加”。

打开 EditEmployees.aspx 页。

切换到“设计”视图。

键入“Edit Employees”，选择此文本，然后将文本格式化为标头。

在工具箱中，从“数据”组中将“DetailsView”控件拖动到页面上。

右击“DetailsView”控件，单击“属性”，然后将“AllowPaging”设置为 true。

这将允许您在显示各个雇员项时进行分页。

右击“DetailsView”控件，并单击“显示智能标记”。

在“DetailsView 任务”菜单的“选择数据源”框中单击“<新建数据源>”.。

出现“数据源配置向导”对话框。

在“选择数据源类型”下单击“数据库”。

保留默认名称“SqlDataSource1”，然后单击“确定”。

“配置数据源”向导显示“选择连接”页。

在“应用程序连接数据库应使用哪个数据连接？”框中输入在“创建与 SQL Server 的连接”中创建的连接，然后单击“下一步”。

该向导显示一页，从该页中您可以选择将连接字符串存储到配置文件中。将连接字符串存储在配置文件中有两个优点：

• 比将它存储在页面中更安全。

• 可以在多个页中使用同一连接字符串。

选择“是，将此连接另存为”复选框，然后单击“下一步”。

该向导显示一页，从该页中您可以指定要从数据库中检索的数据。

在“配置 Select 语句”页上选择“指定来自表或视图的列”，然后在“名称”框中单击“雇员”。

在“列”下，选中“EmployeeID”、“Lastname”、“Firstname”和“HireDate”复选框，然后单击“下一步”。

单击“测试查询”以预览数据，然后单击“完成”。

按 Ctrl+F5 运行该页。

第一条雇员记录在 DetailsView 控件中显示。

单击页码链接以查看其他雇员记录。

关闭浏览器。

在“工具箱”中，从“数据”组中将“GridView”控件拖动到页面上。

右击“GridView”控件，单击“显示智能标记”，然后在“GridView 任务”菜单的“选择数据源”框中，单击“SqlDataSource1”。

在“GridView 任务”菜单上单击“配置数据源”。

单击“下一步”以前进到向导的“配置 Select 语句”页。

在“配置 Select 语句”页上单击“高级”，选中“生成 INSERT、UPDATE 和 DELETE 语句”复选框，然后单击“确定”。

这将基于先前配置的 Select 语句为 SqlDataSource1 控件生成 Insert、Update 和 Delete 语句。

注意
另外，可以通过选择“指定自定义 SQL 语句或存储过程”并输入 SQL 查询来手动创建语句。

单击“下一步”，然后单击“完成”。

现在已使用其他 SQL 语句配置 SqlDataSource 控件。

注意
您可以选择 SqlDataSource 控件并查看 DeleteQuery、InsertQuery 和 UpdateQuery 属性，以便检查由向导生成的语句。还可以切换至“源”视图并检查控件的标记，以便查看已更新的控件属性。

在“GridView 任务”菜单上，选中“启用分页”和“启用编辑”复选框。

安全注意
ASP.NET 网页中的用户输入可能包括潜在有害的客户端脚本。默认情况下，ASP.NET 网页验证用户输入，以便确定输入不包括脚本或 HTML 元素。只要启用了此验证，就不需要显式检查用户输入中的脚本或 HTML 元素。有关更多信息，请参见脚本侵入概述。

按 Ctrl+F5 运行该页。

“GridView”控件与文本框中的数据一起显示。

在“GridView”控件中选择一行并单击“编辑”。

更改记录，然后单击“更新”。

现在，已更新的数据同时在“GridView”控件和“DetailsView”控件中显示。

关闭浏览器。

右击“DetailsView”控件，然后单击“显示智能标记”。

在“DetailsView 任务”菜单上，选中“启用插入”、“启用编辑”和“启动删除”复选框。

在本演练的前面部分使用 DetailsView 控件时，用于启用编辑、插入和删除的选项不可用。这是因为 DetailsView 控件所绑定到的“SqlDataSource1”控件没有必需的 SQL 语句。现在已经配置数据源以包括更新语句，所以更新选项在 DetailsView 控件上可用。

按 Ctrl+F5 运行该页。

“DetailsView”控件显示一条雇员记录。

在“DetailsView”控件中单击“编辑”。

现在，“DetailsView”控件将数据显示在文本框中。

更改记录，然后单击“更新”。

更新的记录显示在控件中。

在“DetailsView”控件中单击“新建”。

现在，控件为每一列显示空白文本框。

输入每列的值。

Employees 表有一个自动增量的键列，所以保存记录时，“EmployeeID”的值自动赋值。

完成后，单击“插入”。

新的记录将添加为最后一条记录。

注意
在本演练中，在 Employees 表中插入新记录不会生成任何错误。但处理产品数据时，表格可能有约束（如外键约束），配置 DetailsView 控件时必须注意这一点。

在“DetailsView”控件中使用分页，定位到最后一条记录，然后单击“删除”。

新记录被移除。

注意
和插入数据相同，配置 DetailsView 控件以允许删除时必须始终注意任何应用到数据行的约束。