Web技术应用项目化教程项目4任务4.2.pptVIP

任务4.2.3 使用DetailsView实现对学生成绩信息的增删改操作二 【知识准备】 1. DetailsView控件自定义操作按钮简介 DetailsView控件对学生成绩信息的增、删、改操作在任务4.2.2中 已经介绍，但在任务4.2.2中没有使用模板列，而且进行删除操作时没 有一个友好的提示信息。在本任务中我们利用此控件实现学生成绩 单个记录的显示。 使用模板列要手工添加“编辑”、“删除”、“取消”、“插入”等LinkButton 按钮。此时不需要在DetailsView控件启用编辑、插入、删除操作 ，设置如下三个属性设置为假（Talse）。 AutoGenerateDeleteButton=false AutoGenerateEditButton=false AutoGenerateInsertButton=false 2. DetailsView控件的模板列 任务4.2.3 使用DetailsView实现对学生成绩信息的增删改操作二 图4.38 DetailsView便捷任务面板 图4.39 DetailsView“字段”对话框1 任务4.2.3 使用DetailsView实现对学生成绩信息的增删改操作二 图4.40 DetailsView“字段”对话框2窗口1 《Web技术应用项目化教程》 第*页 项目四 ADO.NET组件和Web数据控件 理解与掌握SqlDataSource数据源控件、 Web数据控件及其使用方法。 项目四目标 任务4.2 DetailsView控件操作学生成绩信息 任务4.2.1使用DetailsView显示GridView控件中查询的学生成绩信息 【知识准备】 1. DetailsView控件 2. Div控件 任务4.2.1使用DetailsView显示GridView控件中查询的学生成绩信息 【任务要求】 使用SqlDataSource、GridView、DetailsView控件，实现当从 GridView(仅含有ID、StuNo、StuName、Sex、ClassID)中选择 一条记录时，在DetailsView显示该条记录的“详细信息”，并要求在 “详细信息”部分中使用滚动条。“详细信息”只在选择记录时打开显示 ，并可在打开时关闭显示。 【任务分析】 （1）根据任务4.2.1需要，为了实现任务目的，需要在窗体上增加 SqlDataSource控件、GridView数据显示控件、DetailsView选 择控件，这些控件的设置如表4.15所示。 任务4.2.1使用DetailsView显示GridView控件中查询的学生成绩信息 【任务要求】 使用SqlDataSource、GridView、DetailsView控件，实现当从 GridView(仅含有ID、StuNo、StuName、Sex、ClassID)中选择 一条记录时，在DetailsView显示该条记录的“详细信息”，并要求在 “详细信息”部分中使用滚动条。“详细信息”只在选择记录时打开显示 ，并可在打开时关闭显示。 【任务分析】 （1）根据任务4.2.1需要，为了实现任务目的，需要在窗体上增加 SqlDataSource控件、GridView数据显示控件、DetailsView选 择控件，这些控件的设置如表4.15所示。 任务4.2.1使用DetailsView显示GridView控件中查询的学生成绩信息 任务4.2.1使用DetailsView显示GridView控件中查询的学生成绩信息 （2）使用两个绝对定位的Div可实现“详细信息”部分整体定位\记录 部分定位与滚动。标题和“关闭”按钮部分可用table布局。DetailsView 控件的数据源，仍使用SqlDataSource类型控件，只是另一个不同的控 件实例SqlDataSource2，它带有Select参数，其参数值由GridView 控件中的“选择”按钮所在行ID（学号）决定。详细见表4.15所示。 其实现的页面如图4.29所示。 任务4.2.1使用DetailsView显示GridView控件中查询的学生成绩信息 图4.29 任务4.2.1选择一条记录显示的结果 任务4.2.1使用DetailsView显示GridView控件中查询的学生成绩信息 【操作步骤】 （1）创建一个网站，名称为“4_2_1”。右击“解决方案资源管理器”中 输入文件名4_2_1.aspx。 在4_2_1.aspx页面上添加两个div,并设置其样式。其代码如下。 div id=div1 style=height: 178px; width: 452px; overflow: hidden; /div //注意div