网络编程实训指导书(新编)

网络编程综合实训网络编程综合实训 课程实训指导书 谢建华谢建华 编著编著 系部 专业 班级 学号 姓名 江门职业技术学院电子与信息技术系 网络编程综合实训网络编程综合实训 实训目录实训目录 实实 训训 须须 知知 考考 核核 要要 求求 实训一实训一 个人信息显示页面个人信息显示页面 一 实训目的 二 实训内容与实训要求 三 实训总结与反思 四 实训成绩 实训二实训二 会员注册系统会员注册系统 一 实训目的 二 实训内容与实训要求 三 实训总结与反思 四 实训成绩 实训三实训三 个人信息验证个人信息验证 一 实训目的 二 实训内容与实训要求 三 实训总结与反思 四 实训成绩 实训四实训四 将将 WebWeb 页转换为页转换为 WebWeb 用户控件用户控件 一 实训目的 二 实训内容与实训要求 三 实训总结与反思 四 实训成绩 实训五实训五 学生成绩管理系统学生成绩管理系统 一 实训目的 二 实训内容与实训要求 三 实训总结与反思 四 实训成绩 实训六实训六 母版页与导航控件母版页与导航控件 一 实训目的 二 实训内容与实训要求 三 实训总结与反思 四 实训成绩 实训七实训七 修改数据库信息修改数据库信息 一 实训目的 二 实训内容与实训要求 三 实训总结与反思 四 实训成绩 实训八实训八 实现新闻内容的输入实现新闻内容的输入 一 实训目的 二 实训内容与实训要求 三 实训总结与反思 四 实训成绩 实训九实训九 完成新闻内容的管理完成新闻内容的管理 一 实训目的 二 实训内容与实训要求 三 实训总结与反思 四 实训成绩 实训十实训十 分页功能分页功能 一 实训目的 二 实训内容与实训要求 三 实训总结与反思 四 实训成绩 实训十一实训十一 新闻发布系统新闻发布系统 一 实训目的 二 实训内容与实训要求 三 实训总结与反思 四 实训成绩 实实 训训 须须 知知 1 实训前 应认真阅读本次实训的全部内容 明确实训目的和实训任 务 做好必要的实训准备 2 实训前 应注意收集平时学习生活中的典型模块代码 优秀作品 留作实训中借鉴 3 提前五分钟以上进入实训室 不得迟到 4 实训中充分利用实训的宝贵时间积极思考 注重细节 争取高标准 当堂完成实训 5 珍惜实训时间 不开小差 不做与实训无关的事 更不得打游戏 或上网聊天 6 保持实训室安静和清洁卫生 不得大声喧哗 不得在实训室吃东西 7 实训报告以作品文档的形式提交 格式为 姓名 学号 每次实训 的源程序文件必须上交 并且须保存在相应的实训目录中 如实训一的源程序 文件须存放在实训一文件夹中 实训一实训一 个人信息显示页面个人信息显示页面 一 实训目的一 实训目的 1 使学生了解 ASP NET 的服务器控件的基本知识 掌握运用服务器控件进行程序设 计的方法 2 掌握常用服务器控件的属性 事件与方法 3 掌握利用 VS2005 开发 Web 应用程序的方法 二 实训内容与实训二 实训内容与实训要求要求 1 利用控件设计如下图 1 1 所示的页面视图和效果图 当单击提交按钮时 录入的信 息按图中格式显示 利用 Text Radio Checkbox TextArea File Button Div 和 Image 等控件设置个人信息页面 当单击提交按钮时 可以将文件上传到服务器端 同时 在下方将图片信息显示出来 图 1 1 个人信息表 页面视图和效果图 2 利用表格分别列出程序的前台页面代码和程序实现逻辑代码 三 实训总结与反思三 实训总结与反思 四 主要技术四 主要技术 实训二实训二 会员注册系统会员注册系统 一 实训目的一 实训目的 掌握常用 Web Server 控件的事件和属性 并能灵活的选择控件进行程序设计 掌握 会员注册系统 的实现方法 二 实训内容与实训要求二 实训内容与实训要求 我们经常在一些网站上用到会员注册功能 比如下载资源前 加入某论坛等等 会员 注册系统在实现中需要使用多种 Web Server 控件 会员注册系统 填写会员信息页 reg aspx 运行效果如图 2 1 所示 图 2 1 会员注册系统 填写基本信息页 点击页面上的 填写详细资料 按钮 将显示更多的内容供用户输入 显示效果如图 2 2 所示 图 2 2 会员注册系统 填写详细资料页 点击页面上的 提交注册 按钮 当前页面将填写的数据显示出来 如图 2 3 所示 图 2 3 会员注册系统 显示信息页 点击页面上的 重新填写 按钮 将注册页面里输入的信息清空 显示效果同图 2 2 的效果相同 2 利用表格分别列出程序的前台页面代码和程序实现逻辑代码 三 实训总结与反思三 实训总结与反思 html xmlns http www w3 org 1999 xhtml 会员注册 用 户 名 密 码 确认密码 电子邮件 性 别 学 历 小学 中学 大专 本科 毕业时间 Width 38px 所在城市 锦州 上海 大连 北京 出生日期 个人爱好 个人简介 会员注册信息如下 用 户 名 密 码 电子邮件 详细资料如下 性 别 学 历 毕业时间 所在城市 出生日期 个人爱好 个人简介 后台代码如下后台代码如下 Protected Sub Page Load1 ByVal sender As Object ByVal e As System EventArgs Handles Me Load Panel1 Visible False End Sub Protected Sub Btn Click ByVal sender As Object ByVal e As System EventArgs Handles Btn Click 点击填写详细资料按钮的程序代码 Dim I As Short J As Short K As Short Dim Iy As Integer Dim uY As ListItem Dim uM As ListItem Dim uD As ListItem For I 1 To 20 Uyear Items Remove I Iy 1969 I uY New ListItem Iy ToString 密码 确认密码 年龄 Email 三 实训总结与反思三 实训总结与反思 四 实训成绩 由老师填写 四 实训成绩 由老师填写 实训表现实训表现实训报告实训报告实训成绩实训成绩 实训四实训四 将将 WebWeb 页转换为页转换为 WebWeb 用户控件用户控件 一 实训目的一 实训目的 1 同学们能了解用户控件的基础知识 掌握创建用户控件的方法 如何添加属性 如 何添加事件及使用代码隐藏来创建用户控件 并能运用所学知识在 Web 页面中引用用户控 件 2 引用用户控件控件的方法与主要代码 二 实训内容与实训要求二 实训内容与实训要求 Web 用户控件可以使用现有的控件 当某个 Web 页需要完成这一功能时便可以直接将 该用户控件添加到页面中 这给程序开发带来了极大的方便 本实例是将单文件 ASP NET 网页转换为用户控件 运行的效果如图 4 1 所示 单击下面的链接时是会打开相应的页面 图 4 1 将网页转换为用户控件 2 利用表格分别列出程序的前台页面代码和程序实现逻辑代码 网站首页 用户注册 最新消息 留言板 论坛首页 三 实训总结与反思三 实训总结与反思 四 实训成绩 由老师填写 四 实训成绩 由老师填写 实训表现实训表现实训报告实训报告实训成绩实训成绩 实训五实训五 学生成绩管理系统学生成绩管理系统 一 实训目的一 实训目的 掌握 ADO NET 的基本组成 掌握数据库访问的基本方法 能够编写完成一定 功能的实用程序 完成学生成绩管理模块中管理员模块的功能 完成教师 学生 课程信息的录 入与修改 二 实训内容与实训要求二 实训内容与实训要求 完成管理员登录页面 课程信息 学生信息 教师信息维护页面的设计 写出主要设 计代码 本系统可以完成学生成绩的浏览 录入 查询等操作 学生成绩管理系统 主页 index aspx 效果如图 5 1 所示 图 5 1 学生成绩管理系统 主页 进入本系统后 各用户被授予的权限不同 完成的功能也各不相同 1 教师功能 教师可按管理员的设定 输入自己所教课程的成绩 2 学生功能 学生输入正确的学号后可以查询自己的成绩 3 管理员功能 管理员可管理学生的基本情况 课程的基本情况与班级的基本情况 并可设置教师的权限 根据功能分析 本系统具有三种类型的用户 即教师 学生 管理员 同时还要显示 学生的成绩 并且由教师输入成绩 数据库分析 E R 图如下 教师 学生 教学任务 成绩 课程班级 所有 管理员 图 5 2 数据库设计 E R 图 2 建立数据库 在设计数据库时 根据数据量的大小 可以选用 ACCESS 等小型数据库 也可以选用 SQLServer 等大型数据库 创建一个名为 Studen 的数据库 创建如下数据表 各数据表结构如图 5 3 所示 图 5 3 数据表设计 学生表 xuesheng 教师表 jiaoshi 成绩表 chengji 管理员表 guanli 课程 表 kecheng 教学任务表 jiaoxuerenwu 专业表 zhuanye 管理员模块主要完成教师 学生 课程信息的录入与修改 当进入管理员界面时 首先需要输入用户名与密码 进入学生 教师界面时也需要输 入用户名与密码 这里与管理员登录界面功能相同 管理员登录界面的设计与实现 管理员登录界面的设计与实现 1 1 界面设计界面设计 主界面如图 5 4 所示 图 5 4 管理员登录界面 课程维护界面设计与实现课程维护界面设计与实现 1 1 界面设计界面设计 课程维护界面主要实现对课程的添加 修改 删除功能 界面设计如图 5 5 所示 图 5 5 课程维护界面 学生信息维护界面设计与实现学生信息维护界面设计与实现 在本例中 仍由管理员对学生信息进行维护 1 1 界面设计界面设计 界面如图 5 6 所示 图 5 6 学生维护界面 教师表信息维护教师表信息维护 本例中由管理员维护教师表中的信息 1 界面设计界面设计 设计好的界面如图 5 7 所示 在此可对教师进行编辑 删除等操作 当单击 选择 按钮选中某条记录时 右边会显示对应的本条记录 当用户单击图 5 7 中的 逐条编辑 按钮时 进入 逐条编辑 页面 显示如图 5 8 所示内容 可逐条对表中记录进行操作 当单击 新建 按钮时 当前页面变为图 5 9 显 示的页面 可向数据库中添加新的记录 图 5 7 教师表维护页面 图 5 8 逐条显示 图 5 9 添加记录 本组程序除 教师表维护页面 中的 逐条编辑 按钮需要写代码之外 不需编写其 它代码 所有功能完全由数据绑定控件实现 2 利用表格分别列出程序的前台页面代码和程序实现逻辑代码 三 实训总结与反思三 实训总结与反思 四 实训成绩 由老师填写 四 实训成绩 由老师填写 实训表现实训表现实训报告实训报告实训成绩实训成绩 实训六实训六 母版页与导航控件母版页与导航控件 一 实训目的一 实训目的 1 通过使用母版页 可以使网站有一个统一的风格 便于网站设计及修改 导航控件 可以使用户快速地找到指定的内容 大大方便了用户的使用 2 掌握建立 使用母版页的基本方法 掌握使用导航控件的基本方法 设计建立一个 较为完整的网站 二 实训内容与实训要求二 实训内容与实训要求 效果图中的图像可以自己选择 要求设计母版页 并用实训五中的教师信息管理页面 中应用母版页 如图 6 1 所示 为添加了导航控件的学生成绩管理系统的 教师管理页面 图 6 1 添加了导航控件的学生成绩管理系统的 教师管理页面 TreeView 控件可以以树形结构置于网页的某一位置 方便导航使用 TreeView 控件的 设计与 Menu 控件类似 也应在母版页中设计 如图 6 2 所示 将 工具箱 中的 TreeView 控件拖拽至母版页上 图 6 2 添加了 TreeView 控件的母版页 由于导航控件是整个网站通用的 故导航控件一般添加在母版页上 图 6 3 菜单项编辑器 将菜单拖拽到母版页上时 默认菜单是纵向的 可以将菜单的 Orentation 属性设为 Horizontal 改成水平菜单 拖拽菜单 将其置于合适的位置即可 SiteMapPath 控件用于显示一组文本或图像超链接 用于定位网站 在使用 SiteMapPath 控件之前 必须先建立一个站点地图 sitemap 文件 创建站点地图 单击 网站 菜单 添加新项 命令 在弹出的对话框中选择 站点地图 模板 建 立 web sitemap 文件 编写代码如下 2 利用表格分别列出程序的前台页面代码和程序实现逻辑代码 三 实训总结与反思三 实训总结与反思 四 实训成绩 由老师填写 四 实训成绩 由老师填写 实训表现实训表现实训报告实训报告实训成绩实训成绩 实训七实训七 修改数据库信息修改数据库信息 一 实训目的一 实训目的 1 掌握 SQL 数据库的操作 2 通过实例掌握数据库的显示 删除与修改 二 实训内容与实训要求二 实训内容与实训要求 设计数据库表及字段 显示表中信息 同时实现删除与修改功能 本案例 MyLibary 中只有一个表 Book Book 表设计如下 2 利用表格分别列出程序的前台页面代码和程序实现逻辑代码 出版时间使用用出版时间使用用 forfor 循环语句进行绑定 循环语句进行绑定 ddlYearddlYear ddlMonthddlMonth ddlDayddlDay 为为 DropDownListDropDownList 控控 件代码如下 件代码如下 protected void Page Load object sender EventArgs e if this IsPostBack for int i 2000 i 2050 i ddlYear Items Add i ToString for int i 1 i 13 i ddlMonth Items Add i ToString for int i 1 i 32 i ddlDay Items Add i ToString else 三 实训总结与反思三 实训总结与反思 四 实训成绩 由老师填写 四 实训成绩 由老师填写 实训表现实训表现实训报告实训报告实训成绩实训成绩 实训八实训八 实现新闻内容的输入实现新闻内容的输入 一 实训目的一 实训目的 1 掌握 SQL 数据库的操作 2 通过实例掌握新闻发布系统中新闻信息的录入 二 实训内容与实训要求二 实训内容与实训要求 实现如图所示的新闻录入页面 其中录入时间可以不显示 直接通过数据库录入当前 时间 新闻类型不少于 2 项 请自行设置 数据库表如下 2 利用表格分别列出程序的前台页面代码和程序实现逻辑代码 三 实训总结与反思三 实训总结与反思 四 实训成绩 由老师填写 四 实训成绩 由老师填写 实训表现实训表现实训报告实训报告实训成绩实训成绩 实训九实训九 完成新闻内容的管理完成新闻内容的管理 一 实训目的一 实训目的 1 掌握 SQL 数据库的操作 2 新闻管理页面的实现 包括分页 修改 删除等功能 二 实训内容与实训要求二 实训内容与实训要求 新闻管理页面的实现 要求包括分页 修改 删除等功能的实现 写出实现的方法和 主要设计代码 如图为修改页面 2 利用表格分别列出程序的前台页面代码和程序实现逻辑代码 三 实训总结与反思三 实训总结与反思 四 实训成绩 由老师填写 四 实训成绩 由老师填写 实训表现实训表现实训报告实训报告实训成绩实训成绩 实训十实训十 分页功能分页功能 一 实训目的一 实训目的 1 掌握自定义分页功能 2 掌握分页控件 AspNetPager 的用法 二 实训内容与实训要求二 实训内容与实训要求 1 A 提供了 2 个功能强大的列表控件 GridView 和 DataList 但其中只有 GridView 控件提供分页功能 DataList 控件具有更高的样式自定义性 所以很多时候我们 喜欢使用 DataList 控件来显示数据 用 PagedDataSource 类实现 DataList 和 Repeater 控件的分页显示 PagedDataSource 类的部分公共属性 AllowCustomPaging 获取或设置指示是否启用自定义分页的值 AllowPaging 获取或设置指示是否启用分页的值 Count 获取要从数据源使用的项数 CurrentPageIndex 获取或设置当前页的索引 DataSource 获取或设置数据源 DataSourceCount 获取数据源中的项数 FirstIndexInPage 获取页中的第一个索引 IsCustomPagingEnabled 获取一个值 该值指示是否启用自定义分页 IsFirstPage 获取一个值 该值指示当前页是否是首页 IsLastPage 获取一个值 该值指示当前页是否是最后一页 IsPagingEnabled 获取一个值 该值指示是否启用分页 IsReadOnly 获取一个值 该值指示数据源是否是只读的 IsSynchronized 获取一个值 该值指示是否同步对数据源的访问 线程安全 PageCount 获取显示数据源中的所有项所需要的总页数 PageSize 获取或设置要在单页上显示的项数 实现如下所示的效果 实现如下所示的效果 利用代码的方法实现 利用分页控件 AspNetPager 实现 实训十一实训十一 新闻发布系统新闻发布系统 系统功能分析与设计 新闻发布系统 是一个简单的发布系统 在这个程序中将要实现以下功能 1 普通用户可以注册 可以浏览新闻 查看新闻的详细情况 2 管理员用户可以管理普通用户信息 可以添加 查看 修改和删除新闻 管理新闻分类和权限 管理 根据以上的分析 可以画出如图 1 1 所示的功能模块图 系统数据库设计 用 SQL Server 创建一个名为 news manage 的数据库 由于系统涉及用户 新闻 新闻 类型 新闻项目及权限等 因此 在该数据库里创建了 5 个数据表 T news 表 用于存储新闻的基本信息 如表 1 1 所示 表 1 1 T news 结构 列名数据类型长度含义备注 NEWSIDint4新闻编号主键 NEWSTITLEvarchar100新闻标题允许为空 CLASSIDInt4类别编号允许为空 NEWSDATEdatetime8新闻发布时间允许为空 NEWSKEYvarchar20关键字允许为空 NEWSOURCEvarchar100新闻来源允许为空 NEWSCONTENTnvarchar3000新闻内容允许为空 USERIDInt4用户编号允许为空 T news user 表 用于存储用户注册的基本信息 如表 1 2 示 表 1 2 T news user 结构 新闻发布系统 普通用户模块 管理员模块 用户 浏览 权限管理 可不用 分类管理 用户管理 新闻管理 图 1 1 系统功能模块图 列名数据类型长度含义备注 USERIDInt4用户编号主键 USERNAMEvarchar50用户名称允许为空 USERPASSWOR D varchar16用户密码允许为空 POWERBit1用户权限允许为空 T class 表 用于存储新闻类型的基本信息 如表 1 3 所示 表 1 3 T class 结构 列名数据类型长度含义备注 CLASSIDInt4类别编号主键 CLASSNAMEvarchar50类别名称允许为空 CLASSDESCvarchar200类别描述允许为空 CLASSORDERInt4类别顺序允许为空 ITEMIDInt4栏目编号允许为空 T item 表 用于存储新闻栏目的基本信息 如表 1 4 所示 表 1 4 T item 结构 列名数据类型长度含义备注 ITEMIDInt4栏目编号主键 ITEMNAMEvarchar50栏目名称允许为空 ITEMDESCvarchar200栏目描述允许为空 ITEMORDERInt4排列顺序允许为空 T popedom 表 用于存储用户权限的基本信息 如表 1 5 所示 表 1 5 T popedom 结构 列名数据类型长度含义备注 POPEDOMIDInt4栏目编号主键 CLASSIDInt4类别编号允许为空 USERIDInt4用户编号允许为空 T log 表 用于存储日志标志的基本信息 如表 1 6 所示 表 1 6 T log 结构 列名数据类型长度含义备注 LOGIDInt4日志编号主键 LOGINIPvarchar15登录 IP允许为空 LOGINDATEdatetime8登录时间允许为空 USERIDInt4登录用户编号允许为空 各表的关系如图 1 2 所示 用户表 t news user 中的 userid 和新闻表 t news 中的 userid 字段对应 用来确定该新闻属于谁发表的 在分类表 t class 中的 classid 和新闻表 t news 中的 classid 字段对应 用来分清该新闻是属于哪个分类的 在栏目表 t item 中的 itemid 和 分类表 t class 中的 itemid 字段相对应 用来确认该该栏目有那些分类 用户表 t news user 中的 power 和权限表 t popedom 中的 popedom 相对应 用来区分该用户是属于那种权限 本例则没有介绍这方面 图 1 2 新闻发布系统数据库中表的关系图 系统页面设计与编码 系统页面主要分为页面配置文件 母版页和主页 普通用户页面和管理员页面等 全局架构与数据设计 1 Web config 文件配置信息 将数据库连接字符串写入标识中 连接字符串名为 标识中 连接字符串名为 news manage ConnectionString 其代码如下所示 2 用于嵌入主页面的头页面的设计 当前多数网站的页面在构建时均采用嵌入的方式来处理页面 即在主页面嵌入了其他 的网页面 这此嵌入的页面一般用来对主页面的进行修饰 本案例设计页面的总体框架 为上下两个部分 其中上部设计一个头页面 用来显示网页的标志 下部为主页面 显示 各类信息 本案例主要介绍主页面的设计 3 母版页文件 母版页文件决定了网站中主要页面的外观 其中母版页 MasterPage master 用于所有模块 如图所示为母版页页面视图 新闻菜单类别的动态显示主要通过 DataList 控件来实现 通过查询新闻类别表 t Class 将新闻类别显示在页面上 同时利用模