WEB技术与应用全套课件完整版ppt教学教程最新最全_第1页
WEB技术与应用全套课件完整版ppt教学教程最新最全_第2页
WEB技术与应用全套课件完整版ppt教学教程最新最全_第3页
WEB技术与应用全套课件完整版ppt教学教程最新最全_第4页
WEB技术与应用全套课件完整版ppt教学教程最新最全_第5页
已阅读5页,还剩239页未读 继续免费阅读

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

1、项目一HTML标记与HTML服务器控件操作 课程目标1.理解C#基础知识。2. 理解与掌握网页的HTML标记、HTML服务器标记及使用方法。 项目一目标任务1.1 设计第一个ASP.NET网站 1. Microsoft.NET平台概述2. .NET Framework框架简介任务1.1 设计第一个ASP.NET网站 3. ASP.NET的发展史4. ASP.NET优势5. ASP.NET的关键技术任务1.1 设计第一个ASP.NET网站 6. ASP.NET程序的系统要求(1)IIS的安装依次单击【开始】【控制面板】【程序】,启动“打开或关闭Windows功能”,出现“Windows组件向导”

2、对话框,如图1.2所示。 任务1.1 设计第一个ASP.NET网站 图1.2 IIS的安装任务1.1 设计第一个ASP.NET网站 【任务要求】 用C#编写创建一个ASP.NET应用程序项目,输出一行“张小楼,310111班”,再输出一行“这是我编写的第一个网页” 。【任务分析】任务背景。根据高职专业、班级设置情况,考虑本课程教学和学生英语水平实际需要,便于学生记忆,选择三门必修课程为:语文、数学和外语(英语),使用分数表示,采用百分制;选择两门选修课程:物理、化学,采用等级制,分A、B、C、D、E(五级)。本单元中的任务都是建立在此基础上创建的学生成绩表作为讲解的数据库表。任务1.1 设计第

3、一个ASP.NET网站 任务1.1 设计第一个ASP.NET网站 图1.3 学生成绩表(tblStuScore)中的数据任务1.1 设计第一个ASP.NET网站 任务HTML代码如下。 1_1.aspx 张小楼,310111班 /输出一行字符 这是我编写的第一个网页!/*输出一行字符*/ 任务1.1 设计第一个ASP.NET网站 Default.aspx.cs代码如下:using System;using System.Collections.Generic;using System.Linq;using System.Web;using System.Web.UI;using System.

4、Web.UI.WebControls;public partial class _Default : System.Web.UI.Page protected void Page_Load(object sender, EventArgs e)/此处输入页面加载时的处理代码 任务1.1 设计第一个ASP.NET网站 任务1.1运行效果图:图1.8 第一个网页项目二Web服务器控件操作理解与掌握网页的Web控件及使用方法。项目二目标任务2.1 使用Web常用标准控件操作学生成绩表 【知识准备】 Web标准控件1. 标签(Label)2. 文本框(TextBox)3. 按钮(Button)4. 单

5、选按钮控件(RadioButton)和单选按钮列表控件(RadioButtonList)5. 复选框(CheckBox)和复选列表框控件(CheckBoxList)6. 下拉列表(DropDownList)和列表框(ListBox)控件任务2.1 使用Web常用标准控件操作学生成绩表 【任务要求】 综合应用HTML语言输入一名学生的姓名、性别、三门必修课程(语文、数学和英语)成绩和两门选修课程(物理和化学)成绩。(1)使用table表格定位一名学生考试成绩信息;(2)使用RadioButton表示性别;(3)使用TextBox表示三门必修课程成绩;(4)使用RadioButtonList表示两

6、门选修课程(物理和化学);(5)使用DropDownList表示学生的出生日期;(6)使用ListBox表示学生所在班级;(7)使用Label表示输出的学生成绩信息;(8)使用TextBox的TextMode=MultiLine表示备注信息;(9)使用Button表示输出学生信息和重置按钮。 任务2.1 使用Web常用标准控件操作学生成绩表 【任务分析】根据表单元素要求,要求使用三个文本框,用来输入三门必修课程成绩;使用两组单选按钮,每组五个,分别表示物理和化学的A、B、C、D、E五个等级;需要两组单选按钮列表RadioButtonList,分别表示性别、物理与化学等级等。任务2.1 使用We

7、b常用标准控件操作学生成绩表 【操作步骤】 HTML代码:双击“输出”按钮,其代码。运行效果如图。 任务2.1 使用Web常用标准控件操作学生成绩表 图2.9 2_1.aspx运行效结果任务2.2 使用Web其他标准控件操作学生成绩表【知识准备】Web其他标准控件1. Panel面板控件2. Calendar(日历)控件3. 文件上传控件(FileUpload) 【任务要求】(1)填写一个学生信息,在Web页面上增加一个复选框,其Text=“填写一个学生信息”,当不选中复选框时,关闭Panel面板;当选中复选框时,显示Panel面板,效果如图2.11所示。图2.11 2_2_01.aspx运行

8、效果(a)(b)任务2.2 使用Web其他标准控件操作学生成绩表(2)在工具箱中拖放一个Calendar控件到Web页面(“设计”视图)上,当选择日期和月份时显示效果如图2.12所示。图2.12 2_2_02.aspx运行效果(a)(b)任务2.2 使用Web其他标准控件操作学生成绩表(3)利用文件上传控件,根据需要可以上传一名学生的照片到指定的服务器目录下,其最终效果如图2.13所示。图2.13 2_2_03.aspx运行效果(a)(b)任务2.2 使用Web其他标准控件操作学生成绩表【任务分析】(1)在工具箱上拖放在Panel控件、CheckBox控件,设置其属性如表2.8所示。 任务2.

9、2 使用Web其他标准控件操作学生成绩表【操作步骤】2_2_01.aspx的HTML代码: 2_2_02.aspx的HTML代码:2_2_03.aspx的HTML代码:双击“上传”按钮,进入事件代码编辑窗口,其代码。 项目三Web验证控件操作 理解与掌握Web验证控件及使用方法。项目三目标任务3.1 使用非空字段验证控件操作学生成绩表【知识准备】1. 验证控件概述(1)数据验证性控件的分类(2)数据验证性控件的通用属性2. 非空字段验证控件任务3.1 使用非空字段验证控件操作学生成绩表【任务要求】使用TextBox、RadioButton和ListBox三种控件,输入一个学生的姓名、性别和班级

10、信息,验证其是否为空。【任务分析】本任务为了更好地定位各个控件,使用了一个Table。各个控件的属性表3.4所示。任务3.1 使用非空字段验证控件操作学生成绩表任务3.1 使用非空字段验证控件操作学生成绩表【操作步骤】其HTML代码如下。双击“提交”按钮,进入事件代码编辑窗口,输入如下代码。运行效果如下图。 图3.1 3_1.aspx运行结果(a)(b)任务2.1 使用Web常用标准控件操作学生成绩表 【任务要求】 综合应用HTML语言输入一名学生的姓名、性别、三门必修课程(语文、数学和英语)成绩和两门选修课程(物理和化学)成绩。(1)使用table表格定位一名学生考试成绩信息;(2)使用Ra

11、dioButton表示性别;(3)使用TextBox表示三门必修课程成绩;(4)使用RadioButtonList表示两门选修课程(物理和化学);(5)使用DropDownList表示学生的出生日期;(6)使用ListBox表示学生所在班级;(7)使用Label表示输出的学生成绩信息;(8)使用TextBox的TextMode=MultiLine表示备注信息;(9)使用Button表示输出学生信息和重置按钮。 任务2.1 使用Web常用标准控件操作学生成绩表 【任务分析】根据表单元素要求,要求使用三个文本框,用来输入三门必修课程成绩;使用两组单选按钮,每组五个,分别表示物理和化学的A、B、C、

12、D、E五个等级;需要两组单选按钮列表RadioButtonList,分别表示性别、物理与化学等级等。任务2.1 使用Web常用标准控件操作学生成绩表 【操作步骤】 HTML代码:双击“输出”按钮,其代码。运行效果如图。 任务2.1 使用Web常用标准控件操作学生成绩表 图2.9 2_1.aspx运行效结果任务2.2 使用Web其他标准控件操作学生成绩表【知识准备】Web其他标准控件1. Panel面板控件2. Calendar(日历)控件3. 文件上传控件(FileUpload) 【任务要求】(1)填写一个学生信息,在Web页面上增加一个复选框,其Text=“填写一个学生信息”,当不选中复选框

13、时,关闭Panel面板;当选中复选框时,显示Panel面板,效果如图2.11所示。图2.11 2_2_01.aspx运行效果(a)(b)任务2.2 使用Web其他标准控件操作学生成绩表(2)在工具箱中拖放一个Calendar控件到Web页面(“设计”视图)上,当选择日期和月份时显示效果如图2.12所示。图2.12 2_2_02.aspx运行效果(a)(b)任务2.2 使用Web其他标准控件操作学生成绩表(3)利用文件上传控件,根据需要可以上传一名学生的照片到指定的服务器目录下,其最终效果如图2.13所示。图2.13 2_2_03.aspx运行效果(a)(b)任务2.2 使用Web其他标准控件操

14、作学生成绩表【任务分析】(1)在工具箱上拖放在Panel控件、CheckBox控件,设置其属性如表2.8所示。 任务2.2 使用Web其他标准控件操作学生成绩表【操作步骤】2_2_01.aspx的HTML代码: 2_2_02.aspx的HTML代码:2_2_03.aspx的HTML代码:双击“上传”按钮,进入事件代码编辑窗口,其代码。 项目四 ADO.NET组件和Web数据控件 理解与掌握SqlDataSource数据源控件、Web数据控件及其使用方法。项目四目标任务4.1.1 使用SqlDataSource和GridView控件查询学生成绩信息【知识准备】1. ADO.NET对象和GridV

15、iew控件其语法结构如下。(1)创建学生成绩表(2)ADO.NET对象模型知识任务4.1.1 使用SqlDataSource和GridView控件查询学生成绩信息2. SQL Server .NET的ADO.NET对象的属性和方法(1)SqlConnection类(2)SqlCommand类(3)SqlDataReader类(4)SqlDataAdapter类3. SqlDataSource数据源控件4. GridView控件任务4.1.1 使用SqlDataSource和GridView控件查询学生成绩信息【任务要求】用网格视图GridView控件显示数据库StuScore.mdf中学生成绩

16、表(tblStuScore)中数据。要求显示所有记录中的部分列,列标题应为中文,能选择某条记录,记录奇偶行和选择行的背景不同,能单击某个显示列后按该列进行排序。【任务分析】数据源采用SqlDataSource类型,虽然可以通过修改Select语句实现部分列的选择、列标题应为中文以及排序,因为网格视图控件GridView提供了方便这些操作的功能,所以在本任务中,只通过操作网格视图控件GridView完成这个任务。根据任务需要,为了实现任务目的,需要在窗体上增加SqlDataSource控件、GridView数据显示控件,这些控件的属性设置如表4.9所示。任务4.1.1 使用SqlDataSour

17、ce和GridView控件查询学生成绩信息任务4.1.1 使用SqlDataSource和GridView控件查询学生成绩信息【操作步骤】在工具箱“数据”选项卡中,拖动SqlDataSource到页面“设计”视图上,出现如图4.3所示的界面。 图4.3 配置数据源1任务4.1.1 使用SqlDataSource和GridView控件查询学生成绩信息(3)单击“配置数据源”出现如图4.4所示的对话框。图4.4 配置数据源2任务4.1.1 使用SqlDataSource和GridView控件查询学生成绩信息(4)单击“新建连接”按钮,出现如图4.5所示的“添加连接”对话框。 图4.5 配置数据源3

18、任务4.1.1 使用SqlDataSource和GridView控件查询学生成绩信息(5)出现如图4.6所示的“配置Select语句”对话框,选中“列”表框下的“*”前的复选框。图4.6 配置数据源4任务4.1.1 使用SqlDataSource和GridView控件查询学生成绩信息(6)单击“下一步”按钮,出现如图4.7所示的对话框,单击【测试查询】按钮,出现查询结果。单击【完成】按钮,配置数据源完成。 图4.7 配置数据源5任务4.1.1 使用SqlDataSource和GridView控件查询学生成绩信息(8)选择4_1_1.aspx的【源】视图,其HTML代码如下。(9)在菜单栏中选择

19、【调试】【开始执行(不调试)】选项,弹出一个窗口,显示4_1_1.aspx的运行结果,如图4.8所示。 图4.8 任务4.1.1运行结果1任务4.1.1 使用SqlDataSource和GridView控件查询学生成绩信息(10)设置网格视图的样式。(11)在菜单栏中选择【调试】【开始执行(不调试)】选项,弹出一个窗口,显示4_1_1.aspx的运行结果,如图4.9所示。 图4.9 任务4.1.1运行结果2任务4.1.1 使用SqlDataSource和GridView控件查询学生成绩信息(12)切换到“源”模式进行修改,更多的改动可在属性窗口进行,如对FooterStyle的修改。如图4.1

20、0所示。图4.10 页脚属性的修改任务4.1.1 使用SqlDataSource和GridView控件查询学生成绩信息(14)右击GridView控件,选择“属性”,在Columns属性的右侧单击,进入如图4.11所示的字段操作对话框,在此对话框中可以修改列标题(HeaderText)删除不需要的字段、调整列的顺序等。图4.11 “字段”对话框任务4.1.1 使用SqlDataSource和GridView控件查询学生成绩信息(14)右击GridView控件,选择“属性”,在Columns属性的右侧单击,进入如图4.11所示的字段操作对话框,在此对话框中可以修改列标题(HeaderText)删

21、除不需要的字段、调整列的顺序等。任务4.1.1 使用SqlDataSource和GridView控件查询学生成绩信息运行结果如图4.12所示。 图4.12 任务4.1.1运行结果3【知识准备】1. 带控件参数的SqlDataSource2. 控件参数的使用(ControlParameter)任务4.1.2 使用带控件参数的SqlDataSource和GridView控件查询学生成绩信息 【任务要求】(1)结合任务4.1.1使用DropDownList控件查询学生成绩信息,其“DropDownList中显示的数据字段”为学生的姓名(StuName)。(2)结合任务4.1.1使用TextBox控件

22、,输入学生的姓名查询学生成绩信息。【任务分析】(1)使用DropDownList控件时,只需要设置DropDownList绑定的数据源,特别关键的是DataTextField(显示的数据字段)为学生姓名(StuName)、 DataValueField(DropDownList值选择的数据字段)为学号(ID)两个属性。根据任务4.1.2(1)需要,为了实现任务目的,需要在窗体上增加SqlDataSource控件、GridView数据显示控件和DropDownList选择控件,这些控件的属性设置如表4.10所示。任务4.1.2 使用带控件参数的SqlDataSource和GridView控件查询

23、学生成绩信息 【任务要求】(1)结合任务4.1.1使用DropDownList控件查询学生成绩信息,其“DropDownList中显示的数据字段”为学生的姓名(StuName)。(2)结合任务4.1.1使用TextBox控件,输入学生的姓名查询学生成绩信息。【任务分析】(1)使用DropDownList控件时,只需要设置DropDownList绑定的数据源,特别关键的是DataTextField(显示的数据字段)为学生姓名(StuName)、 DataValueField(DropDownList值选择的数据字段)为学号(ID)两个属性。根据任务4.1.2(1)需要,为了实现任务目的,需要在窗

24、体上增加SqlDataSource控件、GridView数据显示控件和DropDownList选择控件,这些控件的属性设置如表4.10所示。任务4.1.2 使用带控件参数的SqlDataSource和GridView控件查询学生成绩信息 任务4.1.2 使用带控件参数的SqlDataSource和GridView控件查询学生成绩信息 任务4.1.2 使用带控件参数的SqlDataSource和GridView控件查询学生成绩信息 图4.13 任务4.1.2(1)运行结果任务4.1.2 使用带控件参数的SqlDataSource和GridView控件查询学生成绩信息 任务4.1.2 使用带控件参

25、数的SqlDataSource和GridView控件查询学生成绩信息 图4.14 任务4.1.2(2)运行结果效果任务4.1.2 使用带控件参数的SqlDataSource和GridView控件查询学生成绩信息 【操作步骤】(2)在工具箱“数据”选项卡中,拖动两个SqlDataSource控件、一个DropDown控件到页面“设计”视图上,根据任务4.1.1操作步骤配置其数据源。(3)继续(2)出现如图4.15所示的“配置Select语句”对话框,选中“列”列表框下的列“*”前的复选框。(4)绑定控件参数。单击“WHERE”按钮,出现如图4.16所示的对话框,配置Select语句,在“列”下拉

26、列表框选择“ID”;在“源”下拉列表框中选择“Control”;在“参数属性”的“控件ID”下拉列表框中选择“DropDownList1”;设置“默认值”为1,单击“添加”按钮。任务4.1.2 使用带控件参数的SqlDataSource和GridView控件查询学生成绩信息 绑定控件参数。单击“WHERE”按钮,出现如图4.16所示的对话框 。图4.15 配置数据源1任务4.1.2 使用带控件参数的SqlDataSource和GridView控件查询学生成绩信息 绑定控件参数。单击“WHERE”按钮,出现如图4.16所示的对话框 。图4.15 配置数据源1任务4.1.2 使用带控件参数的Sql

27、DataSource和GridView控件查询学生成绩信息 图4.16 配置数据源2任务4.1.2 使用带控件参数的SqlDataSource和GridView控件查询学生成绩信息 (5)单击“确定”按钮,返回上一对话甚框,如图4.18所示,在SELECT语句列表框中出现如下代码:图4.18 配置数据源43任务4.1.2 使用带控件参数的SqlDataSource和GridView控件查询学生成绩信息 (6)单击 “完成”按钮,配置SqlDataSource1数据源完成。(7)同样,配置SqlDataSource2数据的SELECT语句列表框中出现如下代码。SELECT ID,StuName

28、FROM tblStuScore /注意此处仅有两个列ID,StuName任务4.1.2 使用带控件参数的SqlDataSource和GridView控件查询学生成绩信息 (8)单击“DropDownList1”右上角,选中“AutoPosBack”复选框,并选择“配置数据源”。 图4.19 配置数据源54任务4.1.2 使用带控件参数的SqlDataSource和GridView控件查询学生成绩信息 (9)右击“GridView1”控件设置其“DataSourceID”为“SqlDataSource1”;设置“DataKeyNames” (数据源中键字段列表)为“ID”。(10)选择Web页

29、面的“源”视图,其HTML代码如下。任务4.1.2 使用带控件参数的SqlDataSource和GridView控件查询学生成绩信息 (9)右击“GridView1”控件设置其“DataSourceID”为“SqlDataSource1”;设置“DataKeyNames” (数据源中键字段列表)为“ID”。(10)选择Web页面的“源”视图,其HTML代码如下。(11)在菜单栏中选择【调试】【开始执行(不调试)】选项,即弹出一个窗口,显示4_1_2_1.aspx的运行效果,如图4.13所示。(12)选择“解决方案资源管理器”,右击鼠标,在弹出的快捷菜单中选择“添加新项”,弹出“添加新项”对话框

30、,选择“Web窗体”,输入名称为“4_1_2_2”,产生新的页面视图4_1_2_2.aspx。(13)在工具箱“数据”选项卡中,拖动一个SqlDataSource控件、一个TextBox控件、一个Button按钮、一个Label标签控件到页面“设计”视图上,根据任务4.1.1操作步骤配置其数据源。(任务4.1.2 使用带控件参数的SqlDataSource和GridView控件查询学生成绩信息 (14)继续步骤(2)出现如图4.14所示的“配置Select语句”对话框,选中“列”列表框下的“*”前的复选框。(15)绑定控件参数。单击“WHERE”,出现如图4.20所示的对话框,配置Select

31、语句,在“列”下拉列表框选择“StuName”;在“源”下拉列表框中选择“源”列表框选择“Control”;在“参数属性”的“控件ID”下拉列表框中选择“TextBox1”;设置“默认值”为“韦一笑”,单击“添加”按钮。任务4.1.2 使用带控件参数的SqlDataSource和GridView控件查询学生成绩信息 图4.20 配置数据源5任务4.1.2 使用带控件参数的SqlDataSource和GridView控件查询学生成绩信息 (16)单击“确定”按钮,返回上一窗口,如图在SELECT语句列表框中出现如下代码。SELECT ID,StuName FROM tblStuScore WHE

32、RE (StuName = StuName)(17)单击“完成”按钮,配置SqlDataSource1数据源完成。(18)选择Web页面的“源”视图,其HTML代码如下。(20)在菜单栏中选择【调试】【开始执行(不调试)】选项,弹出一个窗口,显示4_1_2_2.aspx的运行结果,如图4.14所示。任务4.1.3 使用GridView控件实现对学生成绩信息的修改、删除【知识准备】 GridView控件编辑、更新、删除列图4.22 GridView编辑列“字段”对话框任务4.1.3 使用GridView控件实现对学生成绩信息的修改、删除【知识准备】 GridView控件编辑、更新、删除列图4.2

33、2 GridView编辑列“字段”对话框任务4.1.3 使用GridView控件实现对学生成绩信息的修改、删除【任务要求】用GridView控件修改数据库StuScore中学生成绩表tblStuScore中的数据。在任务4.1.1基础上增加“删除”、“编辑”功能。【任务分析】本任务是在任务4.1.1基础上,实现对学生成绩信息的删除、修改功能。根据任务要求,需要在Web页面增加一个SqlDataSource控件 、一个GridView控件,其属性设置与说明如表4.12所示。任务4.1.3 使用GridView控件实现对学生成绩信息的修改、删除【操作步骤】(1)建立一个名为4_1_3的网站。右击“

34、解决方案资源管理器” 输入文件名4_1_3.aspx。在Default.aspx页面的拖放一个SqlDataSource和GridView控件,并根据表4.12设置控件属性,千万别忘了设置GridView的DataSourceID=“SqlDataSource1”,并设置4_1_3.aspx的标题为“4_1_3.aspx”。(2)单击GridView控件右上角的“智能标记”,选择“启用排序”、“调用分页”、“启用选定内容”(可在“字段”修改对话框中添加)。(3)右击SqlDataSource1,在弹出的快捷菜单国选择“属性”,弹出“属性”对话框,选择“DeleteQuery”,单击其右侧的按钮

35、,弹出“命令和参数编辑器”对话框,在“DELETE命令”文本框中输入如下代码。delete from tblStuScore where ID=ID任务4.1.3 使用GridView控件实现对学生成绩信息的修改、删除图4.24 添加“编辑”、“删除”和“选择”按钮的GridView设计界面任务4.1.3 使用GridView控件实现对学生成绩信息的修改、删除(6)测试页面。在菜单栏中选择【调试】【开始执行(不调试)】选项,弹出一个窗口,显示4_1_3.aspx的运行结果,单击“编辑”链接按钮,如图4.25所示(部分内容)。图4.25 GridView运行时的“编辑”状态任务4.1.3 使用G

36、ridView控件实现对学生成绩信息的修改、删除(7)单击“源”视图,其HTML代码如下。任务4.1.4 使用GridView控件实现对学生成绩信息的插入【知识准备】GridView控件插入列GridView控件不允许用户插入新记录。这种情况下开发人员经常使用如下的技术增加新记录。(1)在GridView的下面放置一个DetailsView控件。 用户可以通过DetailsView增加新记录,然后这条新记录就会显示在GridView里。(2)通过一个超链接使用户连接到另一个使用DetailsView增加新记录的web form。 一旦记录被添加后就会返回之前的页。任务4.1.4 使用GridV

37、iew控件实现对学生成绩信息的插入【任务要求】使用GridView的页脚模板,在页脚模板上增加可编辑控件和链接按钮,实现插入学生成绩记录。【任务分析】根据任务要求,需要在Web页面增加一个SqlDataSourc控件e 、一个GridView控件,在模板列中增加多个LinkButton按钮,用于实现“插入”、“删除”、“更新”、“编辑”和“取消”操作,其属性设置与说明如表4.13所示。任务4.1.4 使用GridView控件实现对学生成绩信息的插入任务4.1.4 使用GridView控件实现对学生成绩信息的插入图4.26 任务4.1.4 插入记录前图4.27 任务4.1.4 插入记录后任务4.

38、1.4 使用GridView控件实现对学生成绩信息的插入【操作步骤】(1)创建一个网站,名称为“4_1_4”。右击“解决方案资源管理器”中输入文件名4_1_4.aspx。在4_1_4.aspx页面拖放一个SqlDataSource和GridView控件,并根据表4.13设置控件属性,千万别忘了设置GridView的DataSourceID=“SqlDataSource1”,并设置4_1_4.aspx 的标题为“4_1_4.aspx”。(2)单击GridView控件右上角的“智能标记”,选择“启用排序”、“调用分页”、“启用选定内容”(可在字段修改对话框中添加)。(3)右击SqlDataSour

39、ce1,在弹出的快捷菜单中选择“属性”,进入“属性”窗口,选择“DeleteQuery”,单击其右侧的按钮,进入“命令和参数编辑器”对话框,在“DELETE”文本框中输入如下代码。delete from tblStuScore where ID=ID任务4.1.4 使用GridView控件实现对学生成绩信息的插入(4)右击SqlDataSource1,在弹出的快捷菜单中选择“属性”,进入“属性”窗口,选择“InsertQuery”,单击其右侧的按钮,进入“命令和参数编辑器”对话框,在“INSERT”文本框中输入如下代码。Insert tblStuScore(StuNo,stuName,StuS

40、ex,IdentityID,Chinese,Maths,English,Physical,Chemical,Term,ClassID)values(StuNO,StuName,StuSex,IdentityID,Chinese,Maths,English,Physical,Chemical,Term,ClassID)(5)同样设置“SelectQuery”的内容。SelectCommand=”select * from tblStuScore”任务4.1.4 使用GridView控件实现对学生成绩信息的插入(6)设置GridView控件“自动套用格式”为“彩色型”,启用编辑、启用删除,将编辑、

41、删除按钮移动到最右列。图4.28 任务4.1.4 模板列的编辑任务4.1.4 使用GridView控件实现对学生成绩信息的插入(7)编写GridView的RowCommand事件处理方法,RowCommand事件是在单击某行时产生的。右击GridView,在弹出的快捷菜单中选择“属性”,弹出“属性”窗口,在事件RowCommand右侧的空白处双击。GridView控件的RowCommand事件的方法代码如下。protected void GridView1_RowCommand(object sender, GridViewCommandEventArgs e) if (e.CommandNa

42、me = Insert) SqlDataSource1.InsertParametersStuNo.DefaultValue = (GridView1.FooterRow.FindControl(txtStuNo) as TextBox).Text; /省略类似代码 SqlDataSource1.InsertParametersClassID.DefaultValue = (GridView1.FooterRow.FindControl(txtClassID) as TextBox).Text; SqlDataSource1.Insert(); 任务4.1.4 使用GridView控件实现对学

43、生成绩信息的插入(8)右击GridView,在弹出的快捷菜单中选择“属性”,进入“属性”属性窗口,选择“DataKeyNames”,设置其值为“ID”。(9)根据表4.13设置相应链接按钮的CommandName的值分别为“Update”、“Edit”、“Delete”、“Insert”、“Cancel” (10)选择“源”视图,其HTML代码如下。任务4.1.3 使用GridView控件实现对学生成绩信息的修改、删除(4)启用“删除”和“更新”功能。右击GridView控件右上角的“智能标记”,选择“编辑列”选项,进入如图4.11所示的“字段”编辑对话框。进行相应的操作,即可完成。(5)右击

44、GridView,选择“自动套用格式”中“彩色型”。添加“编辑”、“删除”和“选择”按钮后的GridView,如图4.24所示。图4.23 “命令和参数编辑器”对话框任务4.1.2 使用带控件参数的SqlDataSource和GridView控件查询学生成绩信息 (8)单击“DropDownList1”右上角,选中“AutoPosBack”复选框,并选择“配置数据源”。 图4.19 配置数据源54任务3.4使用数据范围验证控件操作学生成绩表 【任务要求】 使用TextBox控件,输入一个学生的姓名,要求非空,语文、数学和英语成绩必须大于等于0,小于等于100,物理和化学等级为AE五个等级。 【

45、任务分析】本任务为了更好地定位各个控件,使用了一个Table。各个控件的属性表3.7所示。任务3.4使用数据范围验证控件操作学生成绩表 【任务要求】 使用TextBox控件,输入一个学生的姓名,要求非空,语文、数学和英语成绩必须大于等于0,小于等于100,物理和化学等级为AE五个等级。 【任务分析】本任务为了更好地定位各个控件,使用了一个Table。各个控件的属性表3.7所示。任务3.4使用数据范围验证控件操作学生成绩表 【操作步骤】 HTML代码。 双击“提交”按钮,进入事件代码编辑窗口,其代码。protected void Button1_Click(object sender, Even

46、tArgs e) Label1.Text = 页面已经通过验证; 任务3.4使用数据范围验证控件操作学生成绩表 运行效果如图。图3.4 3_4.aspx运行效果【操作步骤】其HTML代码如下。双击“提交”按钮,进入事件代码编辑窗口,输入如下代码。运行效果如下图。 图3.1 3_1.aspx运行结果(a)(b)任务3.4使用数据范围验证控件操作学生成绩表 项目五 ADO.NET对象和Web数据控件操作 理解与掌握ADO.NET控件、对象及使用方法。项目五目标任务5.1 使用ADO.NET对象和GridView控件查询学生成绩信息【知识准备】1. ADO.NET对象和Web数据控件在任务4.1.1

47、中我们已经详细介绍了ADO.NET的各个对象(以SQL Server为例):(1)SqlConnection:数据库连接对象。(2)SqlCommand:SQL命令对象。(3)SqlDataReader:SQL数据只读对象。(4)DataSet:数据集对象。(5)SqlDataAdapter:数据适配器对象。详细介绍见项目四任务4.1.1。2. 使用Web.Config文件定义数据库连接串任务5.1 使用ADO.NET对象和GridView控件查询学生成绩信息【知识准备】1. ADO.NET对象和Web数据控件在任务4.1.1中我们已经详细介绍了ADO.NET的各个对象(以SQL Server

48、为例):(1)SqlConnection:数据库连接对象。(2)SqlCommand:SQL命令对象。(3)SqlDataReader:SQL数据只读对象。(4)DataSet:数据集对象。(5)SqlDataAdapter:数据适配器对象。详细介绍见项目四任务4.1.1。2. 使用Web.Config文件定义数据库连接串任务5.1 使用ADO.NET对象和GridView控件查询学生成绩信息 /一种连接串 /另一种连接串 /connectionStrings 任务5.1 使用ADO.NET对象和GridView控件查询学生成绩信息 /一种连接串 /另一种连接串 /connectionStri

49、ngs 任务5.1 使用ADO.NET对象和GridView控件查询学生成绩信息【任务要求】(1)使用ADO.NET对象、GridView控件,分页显示学生成绩信息。(2)自定义分页导航,分页显示学生成绩信息。(3)使用ADO.NET对象、GridView控件、DropDownList控件,不采用分页显示学生成绩信息。【任务分析】(1)首先要在Web.Config配置文件中增加数据连接串,具体方法见知识准备。(2)本任务使用到SqlConnection、SqlDataAdpateer、DataSet,也可使用SqlDataReader(用于不分页GridView)、Sqlcommand等对象。

50、(3)要求使用DropDownList控件、GridView控件。(4)在任务5.1(2)中要求自定义分页导航,其自定义的分页也要求GridView的AllowPaging属性设置为True,可设置PageSize=5。自定义分页可以在PagerTemplate中定义,其代码如下。任务5.1 使用ADO.NET对象和GridView控件查询学生成绩信息【任务要求】(1)使用ADO.NET对象、GridView控件,分页显示学生成绩信息。(2)自定义分页导航,分页显示学生成绩信息。(3)使用ADO.NET对象、GridView控件、DropDownList控件,不采用分页显示学生成绩信息。【任务

51、分析】(1)首先要在Web.Config配置文件中增加数据连接串,具体方法见知识准备。(2)本任务使用到SqlConnection、SqlDataAdpateer、DataSet,也可使用SqlDataReader(用于不分页GridView)、Sqlcommand等对象。(3)要求使用DropDownList控件、GridView控件。(4)在任务5.1(2)中要求自定义分页导航,其自定义的分页也要求GridView的AllowPaging属性设置为True,可设置PageSize=5。自定义分页可以在PagerTemplate中定义,其代码如下(超链接)。任务5.1 使用ADO.NET对象

52、和GridView控件查询学生成绩信息图5.1 任务5.1(1)执行结果图5.2 任务5.1(2)执行结果任务5.1 使用ADO.NET对象和GridView控件查询学生成绩信息图5.3 任务5.1(3)执行结果任务5.1 使用ADO.NET对象和GridView控件查询学生成绩信息【操作步骤】(1)创建一个名为5_1的网站,添加一个Web窗体Default.aspx,修改Default.aspx名称为5_1_1.aspx,设置其标题5_1_1.aspx(可以不设),拖动一个GridView到Web页面上,右击其右上角“智能标记”,选择“编辑列”,弹出字段”编辑对话框,如图5.4所示。图5.4

53、 GridView“字段”编辑列窗口对话框任务5.1 使用ADO.NET对象和GridView控件查询学生成绩信息(2)右击GridView,选择“自动套用格式”为“彩色型”,并在其属性窗口中设置如下属性值。AllowPaging=“True”PageSize=5任务5.1 使用ADO.NET对象和GridView控件查询学生成绩信息(2)右击GridView,选择“自动套用格式”为“彩色型”,并在其属性窗口中设置如下属性值。AllowPaging=“True”PageSize=5(3)双击Web页面,进入Page_Load()事件编码窗口,输入如下代码(超链接)。(4)在GridView属性

54、窗口,选择事件PageIndexChanging,双击该事件右边空白处,弹出该事件代码编辑窗口,输入如下代码。protected void GridView1_PageIndexChanging(object sender, GridViewPageEventArgs e) GridView1.PageIndex = e.NewPageIndex; GridView1.DataBind();任务5.1 使用ADO.NET对象和GridView控件查询学生成绩信息(5)选择【源】视图,其HTML代码如下(超链接)。(6)测试页面。在菜单栏中选择【调试】【开始执行(不调试)】选项,弹出一个窗口,显

55、示5_1_1.aspx的运行结果如图5.1所示。(7)在“解决方案资源管理器”右击项目,在弹出的快捷菜单中选择“添加新项”,添加一个名为5_1_2.aspx的Web窗体,同步骤(1)到(4)相同。(8)点击GridView右上角“智能标记”,选择“编辑模板”,选择PagerTempLate模板,如图5.5所示。图5.5 编辑PagerTemplate模板任务5.1 使用ADO.NET对象和GridView控件查询学生成绩信息(9)选择【源】视图,其HTML代码如下(超链接)。(9)测试页面。在菜单栏中选择【调试】【开始执行(不调试)】选项,弹出一个窗口,显示5_1_2.aspx的运行结果如图5

56、.2所示。(10)在“解决方案资源管理器”右击项目,在弹出的快捷菜单中选择“添加新项”,添加一个名为5_1_3.aspx的窗体,拖放一个table标记,设置成两行一列,复制5_1_3.aspx中的GridView1到表格第2行,设置AllowPaging=false;如5_1_2.aspx一样建立PagerTemplate。(12)在table的第一行输入“请选择班级”,拖放一个DropDownList控件到该文本的右侧。(13)自定义一个方法InitBind(),在Page_Load()事件(方法)中调用InitBind()实现页面载入的初始化,其代码如下代码(超链接)。(含class _5

57、_1_3:System.Web.UI.Page代码) 任务5.1 使用ADO.NET对象和GridView控件查询学生成绩信息(10)选择【源】视图,其HTML代码如下(超链接)。(11)测试页面。在菜单栏中选择【调试】【开始执行(不调试)】选项,弹出一个窗口,显示5_1_2.aspx的运行结果如图5.2所示。(12)在“解决方案资源管理器”右击项目,在弹出的快捷菜单中选择“添加新项”,添加一个名为5_1_3.aspx的窗体,拖放一个table标记,设置成两行一列,复制5_1_3.aspx中的GridView1到表格第2行,设置AllowPaging=false;如5_1_2.aspx一样建立

58、PagerTemplate。(13)在table的第一行输入“请选择班级”,拖放一个DropDownList控件到该文本的右侧。(14)自定义一个方法InitBind(),在Page_Load()事件(方法)中调用InitBind()实现页面载入的初始化,其代码如下代码(超链接)。(含class _5_1_3:System.Web.UI.Page代码) 任务5.1 使用ADO.NET对象和GridView控件查询学生成绩信息(15)在GridView1_PageIndexChanging()事件中输入如下代码,以实现页面导航时刷新页面信息。protected void GridView1_Pa

59、geIndexChanging(object sender, GridViewPageEventArgs e) GridView1.PageIndex = e.NewPageIndex; InitBind1(); (16)测试页面。在菜单栏中选择【调试】【开始执行(不调试)】选项,弹出一个窗口,显示5_1_3.aspx的运行结果,如图5.3所示。任务5.2 使用ADO.NET对象和GridView控件删除、更新学生成绩信息【知识准备】向GridView控件中添加编辑列、删除列是很简单的操作,这在任务5.1中已经介绍了,这里就不再赘述了。【任务要求】用GridView控件修改数据库StuScor

60、e中学生成绩表tblStuScore中数据。在任务3.1基础上增加“删除”、“编辑”功能,要求删除时给出确认提示框。任务5.2 使用ADO.NET对象和GridView控件删除、更新学生成绩信息【任务分析】(1)首先要在Web.Config配置文件中增加数据连接串,具体方法见知识准备。(2)本任务用到SqlConnection、SqlDataAdpateer、DataSet,也可使用SqlDataReader(用于不分页GridView)、Sqlcommand等对象。(3)分页要求GridView的AllowPaging属性设置为True,可设置PageSize=5。(4)在任务4.2的更新、

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

评论

0/150

提交评论