Microsoft Word - 第5章.doc

Size: px

Start display at page:

Download "Microsoft Word - 第5章.doc"

鸭国
5 years ago
Views:

1 第 5 章一致性处理本章主要讲述用于批量处理具有共同特征或功能的模板, 这些模板包括母版页和一些控件或公共函数, 这些控件或公共函数具有多变性, 需要根据不同的功能或需求进行实践才能很好地掌握本章将结合实例讲述涉及一致性处理的母版控件和公共函数的开发与运用本章主要学习目标如下 : 一致的页面管理 ; 菜单操作 ; 一致的数据处理 5.1 一致的页面管理母版页概述在开发 Web 页面程序时, 经常会遇到一些页面之间有相同的风格和样式的情况, 如果每个页面都去编写这些风格和样式代码, 那将是一件非常烦琐和枯燥的工作因此, 自 ASP.NET 2.0 开始提出了母版页的概念, 可以把多个页面之间相同的风格和样式部分放到母版页中, 只需要为每个页面编写不同的内容页即可在 ASP.NET 中母版页有两种作用 : 一是提高代码的复用率 ( 把相同的代码提取出来 ); 二是使整个网站或网站的一部分保持一致的风格和样式创建母版与内容页母版页无法单独在页面中显示, 即不能在浏览器中直接输入母版页的 URL 地址进行访问, 必须通过相关内容页才能呈现出来 Visual Studio 2015 中新建一个母版页的步骤如下 : (1) 打开一个网站后, 单击文件新建文件或在网站项目上右击, 在出现的快捷菜单中选择添加添加新项命令, 打开如图 5-1 所示的添加新项窗口 (2) 确认正确的母版页名称, 确定没有选中选择母版页选项, 然后单击添加按钮, 这样就添加了一个母版页新建母版页的源代码如下 :

图 5-1 添加新项窗口 <%@ Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage. master.cs" Inherits="MasterPage" %> <!DOCTYPE html> <html xmlns="http://www.w3.

2 图 5-1 添加新项窗口 Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage. master.cs" Inherits="MasterPage" %> <!DOCTYPE html> <html xmlns=" <head runat="server"> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <title></title> <asp:contentplaceholder id="head" runat="server"> </asp:contentplaceholder> </head> <body> <form id="form1" runat="server"> <div> <asp:contentplaceholder id="contentplaceholder1" runat="server"> </asp:contentplaceholder> </div> </form> </body> </html> 在母版页中自动生成了两个 ContentPlaceHolder 控件 : 一个在 head 区, 用于在内容页中定义引入外部 JavaScript 文件或者 CSS 文件,ID 为 head; 另一个在 body 区, 位于 <div></div> 之间, 相当于一个占位控件, 以后使用该母版页的内容页中的内容将在这个控件中显示, 默认 ID 为 ContentPlaceHolder1, 可以根据需要自己命名因为母版页中已经创 165 第 5 章一致性处理

ASP.NET 程序设计高级教程 166 建了 <html><head></head><body><form runat="server"></form></body></html> 标记, 所以, 内容页中不允许再出现这些标记新建一个使用母版页的内容页步骤如下 : (1) 打开一个网站后, 单击文件新建文件或在网站项目上右击, 在出现的快捷菜单中选择添加添加新项命令, 打开如图

3 ASP.NET 程序设计高级教程 166 建了 <html><head></head><body><form runat="server"></form></body></html> 标记, 所以, 内容页中不允许再出现这些标记新建一个使用母版页的内容页步骤如下 : (1) 打开一个网站后, 单击文件新建文件或在网站项目上右击, 在出现的快捷菜单中选择添加添加新项命令, 打开如图 5-1 所示的添加新项窗口 (2) 选择 Web 窗体, 注意选中选择母版页选项, 单击添加按钮, 出现如图 5-2 所示选择母版页窗口图 5-2 选择母版页窗口 (3) 选择需要的母版页, 然后单击确定按钮, 完成关联母版页的内容页内容页代码如下 : <%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage.master" Auto EventWireup="true" CodeFile="Default.aspx.cs" Inherits="Default" %> <asp:content ID="Content1" ContentPlaceHolderID="head" Runat="Server"> </asp:content> <asp:content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server"> </asp:content> 在新建的内容页中, 同样有两个控件, 这是两个 Content 控件 ( 内容区域 ), 在这两个控件之间可以写具体的代码 Content 控件有一个属性 ContentPlaceHolderID, 每个 Content 控件就是通过这个属性和母版页中的 ContentPlaceHolder 控件进行关联的, 这两个控件一个和母版页 head 区的 ContentPlaceHolder 控件关联, 一个和 body 区的关联内容页的显示内容代码只有放在 ContentPlaceHolderID 为 ContentPlaceHolder1 的 Content 控件里, 才会在运行时显示母版页的嵌套与动态访问母版页可以嵌套另一个母版页, 让一个母版页引用另外的页作为其母版页, 通常被引用的母版页称为主母版页, 引用的母版页称为子母版页, 一个主母版页可以被多个子母版页引用用嵌套的母版页可以创建组件化的母版页例如, 一个大型网站可能包含一个用

4 于定义站点外观的总体母版页然后, 不同的网站栏目又可以自行定义各自的子母版页, 这些子母版页引用网站母版页, 并相应定义各自的外观与任何母版页一样, 子母版页也包含文件扩展名.master 子母版页通常会包含一些内容控件, 这些控件将映射到父母版页上的内容占位符就这方面而言, 子母版页的布局方式与所有内容页类似但是, 子母版页还有自己的内容占位符, 可用于显示其子页提供的内容主母版页子母版页和内容页的关系如下 : (1) 主母版页包含的内容主要是页面的公共部分, 主母版页嵌套子母版页, 内容页绑定子母版页 (2) 主母版页的构建方法与普通的母版页的方法一致子母版页也是以.master 为扩展名, 其代码包括两个部分, 即代码头声明和 Content 控件子母版页与普通母版页相比, 子母版页中不含有 <html> <body> 等 Web 元素, 并且在子母版页的代码头添加了一个 MasterPageFile 属性, 以设置嵌套子母版页的主母版页路径, 通过设置这个属性, 实现主母版页与子母版页之间的嵌套 (3) 子母版页的 Content 控件中声明的 ContentPlaceHolder 控件用于为内容页实现占位内容页的构建方法与普通内容页的构建方法一致, 它的代码包括两部分, 即代码头声明和 Content 控件由于内容页绑定子母版页, 所以代码头中的 MasterPageFile 属性必须设置为子母版页的路径例 5-1 下面通过实例说明母版页的嵌套 MasterPage.master 是一个主母版页 Master PageResearch.master 和 MasterPageResources.master 是两个子母版页,Research.aspx 和 Resources.aspx 是内容页其中,Research.aspx 内容页绑定 MasterPageResearch.master 子母版页,MasterPageResearch.master 子母版页嵌套 MasterPage.master 主母版页 ;Resources. aspx 内容页绑定 MasterPageResources.master 子母版页,MasterPageResearch.master 子母版页嵌套 MasterPage.master 主母版页程序代码如下 : (1) 建立 MasterPage.master 主母版页, 在源视图模式下输入如下代码 : <%@ Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage. master.cs" Inherits="MasterPage"%> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " <html xmlns=" <head runat="server"> <style type="text/css"> html background-color:#8dd8fe; font:14px 宋体 ;.content width:600px; 167 第 5 章一致性处理

5 ASP.NET 程序设计高级教程 168 margin:auto; border-style:solid; background-color:white; padding:2px;.menu padding-top:8px; padding-left:5px; border-top:solid 1px black; border-bottom:solid 1px black; height:25px; vertical-align:middle;.menu a font:14px 宋体 ; color:#0000ff; text-decoration:none;.leftcolumn float:left; padding:5px; border-right:solid 1px black;.rightcolumn float:left; padding:5px;.clear clear:both; </style> <title>asp.net 母版页嵌套 </title> </head> <body> <form id="form1" runat="server"> <div class="content"> <asp:image id="imglogo" ImageUrl="~/Images/logo.jpg" AlternateText=" 网站 Logo"

6 Runat="server" /> <div class="menu"> <asp:hyperlink id="hyperlink1" Text=" 网站首页 " NavigateUrl="~/default.aspx" Runat="server"> </asp:hyperlink> <asp:hyperlink id="lnkproducts" Text=" 研发部门 " NavigateUrl="~/Research.aspx" Runat="server"> </asp:hyperlink> <asp:hyperlink id="lnkservices" Text=" 人力资源 " NavigateUrl="~/Resources.aspx" Runat="server"> </asp:hyperlink> </div> <asp:contentplaceholder id="contentplaceholder1" runat="server"> </asp:contentplaceholder> <br class="clear" /> <br /> copyright 2016 by 天津农学院计算机学院 </div> </form> </body> </html> (2) 建立 MasterPageResearch.master 子母版页, 在源视图模式下输入如下代码 : <%@ Master Language="C#" MasterPageFile="~/MasterPage.master" AutoEvent Wireup="true" CodeFile="MasterPageResearch.master.cs" Inherits="Master PageResearch" %> <asp:content id="content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="server"> <div class="leftcolumn"> <asp:contentplaceholder id="contentplaceholder1" Runat="server"> </asp:contentplaceholder> 169 第 5 章一致性处理

7 ASP.NET 程序设计高级教程 170 </div> <div class="leftcolumn"> <asp:contentplaceholder id="contentplaceholder2" Runat="server"> </asp:contentplaceholder> </div> <div class="rightcolumn"> <asp:contentplaceholder id="contentplaceholder3" Runat="server"> </asp:contentplaceholder> </div> </asp:content> (3) 建立 Research.aspx 内容页面, 在源视图模式下输入如下代码 : <%@ Page Title="" Language="C#" MasterPageFile="~/MasterPageResearch.master" AutoEventWireup="true" CodeFile="Research.aspx.cs" Inherits="Research" %> <asp:content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server"> 工作职责 <br /><br />1. 协助主管对人员的招聘 <br /><br />2. 新进人员和离职人员手续办理 <br /><br />3. 协助主管对新进人员的教育训练 <br /><br />4. 全厂人员档案的建立与管制 <br /><br />5. 对试用人员之试工与考核调查 <br /><br />6. 负责全厂人事异动工作 </asp:content> <asp:content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder2" Runat="Server"> 产品推荐 <br /><br />RFID 运动计时器 <br /><br /> 安卓智能终端 APP 应用软件 <br /><br /> 垃圾箱及车辆管理系统 <br /><br /> 物联网传感器系统 <br /><br /> 体育计时器芯片采集系统 <br /><br /> 学生宿舍管理系统 </asp:content> <asp:content ID="Content3" ContentPlaceHolderID="ContentPlaceHolder3"

8 Runat="Server"> 联系我们 <br /><br /> 联系电话 : <br /><br /> <br /><br /> 联系地址 : </asp:content> (4) 建立 MasterPageResources.master 子母版页, 在源视图模式下输入如下代码 : <%@ Master Language="C#" MasterPageFile="~/MasterPage.master" AutoEvent Wireup="true" CodeFile="MasterPageResources.master.cs" Inherits="Master PageResources" %> <asp:content id="content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="server"> <div class="leftcolumn"> <asp:contentplaceholder id="contentplaceholder1" Runat="server"> </asp:contentplaceholder> </div> <div class="rightcolumn"> <asp:contentplaceholder id="contentplaceholder2" Runat="server"> </asp:contentplaceholder> </div> </asp:content> (5) 建立 Resources.aspx 内容页, 在源视图模式下输入如下代码 : <%@ Page Title="" Language="C#" MasterPageFile="~/MasterPageResources.master" AutoEventWireup="true" CodeFile="Resources.aspx.cs" Inherits="Resources" %> <asp:content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server"> 行业新闻 <br /><br /> 中国人力资源服务业市场潜力巨大 <br /><br /> 播撒火种指引脱贫方向 <br /><br /> 培训跟上打工不慌 <br /><br /> 人社部国务院扶贫办召开粤湘鄂劳务 <br /><br /> 就业如何又稳又好? 总理这样说 <br /><br />2016 年中国技能大赛暨第 44 届世界 </asp:content> 171 第 5 章一致性处理

<br /><br /> 北京最低工资线提高 1160 元 <br /><br /> 贵州七项措施推进军转安置 </asp:content> (6) 分别运行 Research.aspx 和 Resources.

9 ASP.NET 程序设计高级教程 172 <asp:content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder2" Runat="Server"> <b> 工作动态 </b> <br /><br /> 河南加快推进调解仲裁工作规范化建设 <br /><br /> 陕西西安拟 3 年免费培训 9 万人促就业扶贫 <br /><br /> 河北建立约谈制度规范社保基金监管 <br /><br /> 四川与云南开通跨省异地就医即时联网结算 <br /><br /> 北京最低工资线提高 1160 元 <br /><br /> 贵州七项措施推进军转安置 </asp:content> (6) 分别运行 Research.aspx 和 Resources.aspx 页面, 显示结果如图 5-3 和图 5-4 所示图 5-3 Research.aspx 页面截图图 5-4 Resources.aspx 页面截图母版页的应用范围与缓存 1. 母版页的应用范围编写.NET 程序时通常都是在内容页中绑定母版页, 其实在 VS 中, 母版页应用不局限

10 于内容页, 其应用范围可概括为三种 : 页面级应用程序级和文件夹级 1) 页面级页面级母版页应用是最为常见的内容页可以是应用程序中任意的 aspx 页面, 应用时只需在内容页中正确绑定母版页即可示例代码如下 : <%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage.master" Auto EventWireup="true" CodeFile="****.aspx.cs" Inherits="****" %> 2) 应用程序级有些特殊情况下, 应用程序中多数页面都需要绑定同一个母版页这时, 如果仍然使用页面级母版页的处理方法, 会显得非常烦琐, 且效率不高, 而使用应用程序级母版页的处理方法会变得高效便捷应用程序级母版页配置方法是在应用程序配置文件 Web. Config 中添加一个配置节 <pages>, 并设置其中的 masterpagefile 属性值为母版页 URL 地址示例代码如下 : <system.web> <pages masterpagefile="~/masterpage.master" /> </system.web> 如果经过配置的 Web.Config 文件存储于应用程序根目录下, 那么以上的配置内容将对整个应用程序产生作用默认情况下, 位于根目录下 ( 包括子文件夹中 ) 的所有 aspx 文件将会成为自动绑定 MasterPage.master 的内容页在使用这些内容页时, 不必如同在页面级的情况那样, 为每个页面都设置 MasterPageFile 属性代码头只需包含如下代码 : <%@ Page Title="" Language="C#" AutoEventWireup="true" CodeFile="****.aspx.cs" Inherits="****" %> 以上代码头中, 没有包括对属性 MasterPageFile 的设置, 这是由于系统将自动绑定 Web.Config 文件中所设置的 MasterPage.master 为母版页对于站点内有些 aspx 文件可能不需要自动绑定默认设置的母版页, 而需要绑定其他的母版页的情况, 可以使用如下设置方法, 覆盖 Web.Config 中的设置 : <%@ Page Title="" Language="C#" MasterPageFile="~/OtherPage.master" Auto EventWireup="true" CodeFile="****.aspx.cs" Inherits="****" %> 对于不需要绑定任何母版页的 aspx 文件, 可以使用如下设置 : <%@ Page Title="" Language="C#" MasterPageFile="" AutoEventWireup="true" CodeFile="****.aspx.cs" Inherits="****" %> 3) 文件夹级如果需要将某些文件夹中包含的 aspx 页面成为自动绑定母版页的内容页, 只要将类似的 Web.Config 文件放置在该文件夹中即可 2. 母版页的缓存.NET 中缓存技术是一项非常重要的技术当某个页面被频繁访问时, 如果不使用缓 173 第 5 章一致性处理

11 ASP.NET 程序设计高级教程 174 存技术, 那么, 每访问一次就要和服务器进行一次交互, 这样会对服务器造成很大的负担在被频繁访问的页面中设置缓存, 可以减少用户和服务器的会话次数, 降低服务器的资源消耗缓存技术不仅可以用在普通页面, 还可以在母版页中设置缓存, 从而提高网站性能应注意的是, 不应该把高速缓存直接用到母版页, 即不能把 OutputCache 指令放到母版页上如果这样, 在页面第二次检索时就会出错所以, 为了能让母版页输出高速缓存, 应该把 OutputCache 指令放到内容页上, 这会高速缓存内容页面的内容和母版页的内容通过 OutputCache 指令在内容页中实现缓存的关键代码如下 : <%@ OutputCache Duration="10" VaryByParam="none" %> 有时缓存整个页面是不现实的, 因为页的某些部分可能在每次请求时都发生变化在这些情况下, 只能缓存页面的一部分顾名思义, 页面部分缓存是将页面部分内容保存在内存中以便响应用户请求, 而页面其他部分内容则为动态内容页面部分缓存的实现包括两种方式 : 控件缓存和替换后缓存在控件缓存 ( 也称片段缓存 ) 中, 可以通过创建用户控件来包含缓存的内容, 然后将用户控件标记为可缓存来缓存部分页输出该选项允许缓存页中的特定内容, 而在每次都重新创建整个页例如, 如果创建的页面除了含有大量动态内容 ( 如价格信息 ), 也有部分静态内容 ( 如通知公告 ), 则可以在用户控件中创建这些静态部分并将用户控件配置为缓存缓存后替换与控件缓存正好相反它对页面进行缓存, 但是页中的某些模块是动态的, 因此不会缓存这些模块例如, 如果创建的页在设定的时间段内完全是静态的 ( 例如新闻报道页 ), 可以设置为缓存整个页如果为缓存的页添加旋转广告横幅, 则在页请求时, 广告横幅不缓存 5.2 菜单操作微软为 ASP.NET 提供的菜单控件采用 Table 和 JavaScript, 导致生成大量的 html 代码, 而且在很多浏览器中都无法显示出子菜单, 只能在 IE 中能显示出来影响了用户交互操作的流畅性目前, 许多菜单控件采用 CSS 和 UL List 来显示菜单, 生成的 html 代码少, 很多不需要 JavaScript 支持, 而且支持大部分的浏览器, 增强了网站的界面效果, 提高了用户交互的可操作性下面介绍两种流行的菜单控件 : 下拉式菜单和左边栏菜单例 5-2 下拉式菜单的建立下拉式菜单通常放在网站 Logo 下方, 一般包括主菜单和子菜单, 子菜单又可以分出三级菜单等此控件主要用到 CSS JavaScript 和 UL List (1) 新建一个网站, 在网站中建立 MasterPage2.Master 母版文件, 其源视图代码如下 : <%@ Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage2. master.cs" Inherits="MasterPage2" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "

12 <html xmlns=" <head runat="server"> <meta http-equiv="x-ua-compatible" content="ie=8"> <script type="text/javascript"> window.onresize = function () document.getelementbyid('menu').contentwindow.modefheight(); </script> <asp:contentplaceholder id="head" runat="server"> </asp:contentplaceholder> <link href="css/stylesheet.css" rel="stylesheet" type="text/css" /> <style type="text/css"> html background-color:#8dd8fe; font:14px 宋体 ;.content width:600px; margin:auto; border-style:solid; background-color:white; padding:2px;.clear clear:both; </style> <title>asp.net 下拉菜单 </title> </head> <body> <form id="form1" runat="server"> <div class="content"> <asp:image id="imglogo" ImageUrl="~/Images/logo.jpg" AlternateText=" 网站 Logo" Runat="server" /> <div class="nav"> <div class="menu_main"> <ul id="menu"> <li> 175 第 5 章一致性处理

13 ASP.NET 程序设计高级教程 176 <dl> <dt><a href="default.aspx" class="w"> 网站首页 </a></dt> </dl> </li> <li> <dl> <dt><a href=""> 公司概况 </a></dt> <dd><a href=""> 公司简介 </a></dd> <dd class="last"><a href=""> 公司领导 </a></dd> </dl> </li> <li> <dl> <dt><a href=""> 公司产品 </a></dt> <dd><a href=""> 产品推荐 </a></dd> <dd><a href="" target="_blank"> 新品研发 </a></dd> <dd class="last"><a href=""> 产品销售 </a></dd> </dl> </li> <li> <dl> <dt><a href=" 追溯码查询.aspx"> 公司要闻 </a></dt> </dl> </li> <li> <dl> <dt><a href=""> 技术服务 </a></dt> <dd><a href=""> 售前服务 </a></dd> <dd class="last"><a href=""> 售后服务 </a></dd> </dl> </li> <li> <dl> <dt><a href=""> 联系我们 </a></dt> </dl> </li> </ul> </div> </div> <asp:contentplaceholder id="contentplaceholder1" runat="server"> </asp:contentplaceholder> <br class="clear" /> <br /> copyright 2016 by 天津 *** 科技有限公司 </div> </form>

14 </body> </html> (2) 添加 Style.css 样式表文件, 代码如下 : /*===================menu========================*/.nav background-color: #005e7d; background-repeat: repeat-x; height: 48px; max-width: 600px; padding-top:2px;.menu_main width: 600px; margin: 0 auto; display: block; padding-top: 9px; z-index: 10; #menu margin: 0; padding: 0; display: block; height: 25px; z-index: 10; #menu li float: left; padding: 0; width: 100px; height: 25px; list-style-type: none; /* 设置菜单项 */ #menu li dl margin-top: 3px; padding: 0; height: 25px; z-index: 10; #menu li dt a,#menu li dd a display:block; /* 设置菜单项的 dt */ #menu li dt margin: 0; padding: 5px; 177 第 5 章一致性处理

15 ASP.NET 程序设计高级教程 178 text-align: center; #menu li dt height: 25px; #menu li dt a, #menu li dt a:visited display: block; color: #ef0213; text-decoration: none; height: 25px; font-family: 宋体, Arial, Helvetica, sans-serif; font-weight: 900; font-size: large; width: 100px; #menu li dt a.w, #menu li dt a:hover display: block; color: #FFFFFF; text-decoration: none; height: 24px; font-family: 宋体, Arial, Helvetica, sans-serif; font-weight: 900; font-size: large; /* 设置菜单项的 dd */ #menu li dd margin: 0; padding: 0; color: #fff; background: #005e7d; height: 25px; z-index: 1; position: relative; width: 100px; #menu li dd.last border-bottom: 2px solid #89ad19; #menu li dd a, #menu li dd a:visited display: block; color: #ef0213; text-decoration: none; padding: 4px 5px 4px 20px; height: 1em; font-weight: bolder;

/* 关闭子菜单 */ #menu li dd display:none; /* 设置鼠标响应 */ #menu li:hover dd, #menu li a:hover dd display:block; #menu li:hover, #menu li a:hover border:0;/*ie6*/ #menu li dd a:hover background: #005e7d;

16 /* 关闭子菜单 */ #menu li dd display:none; /* 设置鼠标响应 */ #menu li:hover dd, #menu li a:hover dd display:block; #menu li:hover, #menu li a:hover border:0;/*ie6*/ #menu li dd a:hover background: #005e7d; color: #fff; font-weight: bolder; (3) 添加 Default.aspx 文件, 其源视图代码如下 : <%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage2.master" Auto EventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> <asp:content ID="Content1" ContentPlaceHolderID="head" Runat="Server"> </asp:content> <asp:content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server"> <div style="width:600px; height:200px; text-align:center; verticalalign:middle;"> <br /><br /><br /> 公司首页内容! </div> </asp:content> (4) 运行 Default.aspx 文件, 显示结果如图 5-5 所示图 5-5 下拉菜单页面截图 179 第 5 章一致性处理

17 ASP.NET 程序设计高级教程 180 例 5-3 左边栏菜单的建立左边栏上下滑动菜单是应用较广泛的一种菜单, 它主要应用到 CSS JavaScript 和 UL List (1) 打开一个网站, 新建 css 文件夹, 在 css 文件夹中添加 StyleSheet.css 文件, 该文件代码如下 : /*===================menu========================*/.content width:600px; margin:auto; border-style:solid; background-color:white; padding:2px; * margin: 0; padding: 0; imgborder:0; ul,lilist-style-type:none; a color:#00007f;text-decoration:none; a:hover color:#bd0a01;text-decoration:underline;.treebox width: 200px; margin: 0 auto; background-color:#c36a0a; float:left;.menu overflow: hidden; border-color: #dd8200; border-style: solid ; border-width: 0 1px 1px ; /* 第一层 */.menu li.level1>a display:block; height: 45px; line-height: 45px; color: #ffffff; padding-left: 50px; border-bottom: 1px solid #000; font-size: 16px; position: relative;.menu li.level1 a:hover text-decoration: none;background-color: #d5792e;.menu li.level1 a.current background: #a96206; /*============ 修饰图标 */.ico width: 20px; height: 20px; display:block; position: absolute; left: 20px; top: 10px; background-repeat: no-repeat; background-image: url(images/ico1.png); /*============ 小箭头 */.level1 i width: 20px; height: 10px; background-image: url(images/ arrow.png); background-repeat: no-repeat; display: block; position:

18 absolute; right: 20px; top: 20px;.level1 i.downbackground- position: 0-10px;.ico1 background-position: 0 0;.ico2 background-position: 0-20px;.ico3 background-position: 0-40px;.ico4 background-position: 0-60px;.ico5 background-position: 0-80px; /* 第二层 */.menu li ul overflow: hidden;.menu li ul.level2 display: none;background: #c33605;.menu li ul.level2 li a display: block; height: 45px; line-height: 45px; color: #fff; text-indent: 60px; font-size: 14px; div.top_center width: 600px; padding-bottom: 2px; margin-left: auto; margin-right: auto; height:400px; (2) 新建 MasterPage.Master 母版页文件, 该文件源视图代码如下 : <%@ Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage.master.cs" Inherits="MasterPage" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns=" <head runat="server"> <meta http-equiv="x-ua-compatible" content="ie=8"> <asp:contentplaceholder id="head" runat="server"> </asp:contentplaceholder> <link href="css/stylesheet.css" rel="stylesheet" type="text/css" /> <style type="text/css"> html background-color:#8dd8fe; font:14px 宋体 ; </style> 181 第 5 章一致性处理

19 ASP.NET 程序设计高级教程 182 <script src="scripts/jquery1.8.3.min.js" type="text/javascript"></script> <script src="scripts/easing.js"></script> <script> // 等待 dom 元素加载 $(function() $(".treebox.level1>a").click(function() $(this).addclass('current').find('i').addclass('down').parent().next().slidedown('slow','easeoutquad').parent().siblings().children('a').removeclass('current').find('i').removeclass('down').parent().next().slideup('slow','easeoutquad'); // 隐藏 return false; ); ) </script> <title>asp.net 下拉菜单 </title> </head> <body> <form id="form1" runat="server"> <div class="content"> <asp:image id="imglogo" ImageUrl="~/Images/logo.jpg" AlternateText=" 网站 Logo" Runat="server" /> <asp:contentplaceholder id="contentplaceholder1" runat="server"> </asp:contentplaceholder> <br /> <br /> copyright 2016 by 天津 *** 科技有限公司 </div> </form> </body> </html> 注意在上述代码中引入了 jquery1.8.3.min.js 文件 (3) 新建 Default.aspx 内容页文件, 该文件源视图代码如下 : <%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage.master" Auto EventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> <asp:content ID="Content1" ContentPlaceHolderID="head" Runat="Server"> </asp:content> <asp:content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server"> <div style="width:600px; text-align:left; vertical-align:middle;">

20 <div class="top_center"> <div class="treebox"> <ul class="menu"> <li class="level1"> <a href="#none"><em class="ico ico1"></em> 系统设置 <i class= "down"></i></a> <ul class="level2"> <li><a href="javascript:;"> 系统状态 </a></li> <li><a href="javascript:;"> 数据初始化 </a></li> <li><a href="javascript:;"> 首页设置 </a></li> <li><a href="javascript:;"> 系统日志 </a></li> </ul> </li> <li class="level1"> <a href="#none"><em class="ico ico2"></em> 新闻管理 <i></i></a> <ul class="level2"> <li><a href="javascript:;"> 类别添加 </a></li> <li><a href="javascript:;"> 类别管理 </a></li> <li><a href="javascript:;"> 新闻添加 </a></li> <li><a href="javascript:;"> 新闻管理 </a></li> </ul> </li> <li class="level1"> <a href="#none"><em class="ico ico3"></em> 图片管理 <i></i></a> <ul class="level2"> <li><a href="javascript:;"> 图片添加 </a></li> <li><a href="javascript:;"> 图片管理 </a></li> </ul> </li> <li class="level1"> <a href="#none"><em class="ico ico4"></em> 产品管理 <i></i></a> <ul class="level2"> <li><a href="javascript:;"> 产品添加 </a></li> <li><a href="javascript:;"> 产品管理 </a></li> </ul> </li> <li class="level1"> <a href="#none"><em class="ico ico5"></em> 数据管理 <i></i></a> <ul class="level2"> <li><a href="javascript:;"> 数据备份 </a></li> <li><a href="javascript:;"> 数据恢复 </a></li> </ul> </li> </ul> </div> 183 第 5 章一致性处理

ASP.NET 程序设计高级教程 184 <div style="float: right;text-align:center; vertical-align:middle; width: 400px;height:400px;"> <br /><br /><br /> 系统状态! </div> </div> </div> </asp:content> (4) 运行 Default.

21 ASP.NET 程序设计高级教程 184 <div style="float: right;text-align:center; vertical-align:middle; width: 400px;height:400px;"> <br /><br /><br /> 系统状态! </div> </div> </div> </asp:content> (4) 运行 Default.aspx 内容页文件, 显示结果如图 5-6 所示图 5-6 左边栏菜单截图除了以上两种菜单控件以外, 还有许多个性化的菜单控件, 如 SolpartMenu 控件淘宝式菜单控件和树形菜单控件等, 限于篇幅, 在此不一一列举 5.3 一致的数据处理用.NET 编写程序时, 通常会遇到在不同的页面都要实现同一个功能, 如果对这些功能在每个页面都编写类似的代码, 代码冗余多且容易出现错误所以很多时候把一些函数放在统一的公共类里面, 当需要实现该功能时, 只需调用公共类里面的函数即可, 这样提高了代码的复用率, 并且减少了一些不必要的错误这样的处理方式, 称为一致的数据处理本文对 CRUD 操作分页查询和导出 Excel 等功能进行实例分析 CRUD 操作 CRUD 是指在做计算处理时的增加 (Create) 读取查询 (Retrieve) 更新 (Update) 和删除

22 (Delete) 几个单词的首字母简写在.NET 中主要是对数据库的增加查询更新和删除操作下面通过实例分别说明如何实现 CRUD 操作的一致性处理例 5-4 数据的一致性处理 (1) 增加操作增加操作的实例是为新闻表 NewsTable 添加数据, 处理方法是在数据库中先写好存储过程 insert_newstable, 然后在添加数据的.cs 文件中通过公共类函数 RunProcedure 调用该存储过程 insert_newstable 存储过程公共类函数 RunProcedure 和添加按钮的代码分别如下存储过程代码如下 : CREATE PROCEDURE nvarchar(50) AS INSERT INTO NewsTable ); GO RunProcedure 函数代码如下 : /// <summary> /// 执行存储过程 /// </summary> /// <param name="storedprocname"> 存储过程名 </param> /// <param name="parameters"> 存储过程参数 </param> /// <returns>sqldatareader</returns> public static SqlDataReader RunProcedure(string storedprocname, IData Parameter[] parameters) SqlConnection connection = new SqlConnection(connectionString); SqlDataReader returnreader; connection.open(); SqlCommand command = BuildQueryCommand(connection, storedprocname, 185 第 5 章一致性处理

23 ASP.NET 程序设计高级教程 186 parameters); command.commandtype = CommandType.StoredProcedure; returnreader = command.executereader(); return returnreader; 添加按钮代码如下 : protected void btnok_click(object sender, EventArgs e) if (TextBox1.Text.Trim() == "") // 判断新闻标签不能为空 ScriptManager.RegisterStartupScript(UpdatePanel1, this.gettype(), "alert", "alert(' 新闻名称不能为空!')", true); return; else try SqlParameter[] parameters = new SqlParameter[1]; parameters[0] = new SqlParameter("@ 新闻名称 ", TextBox1.Text. Trim()); DataSet ds = SqlHelper.Query("select * from NewsTable where Title=@ 新闻名称 ", parameters); // 查询新闻标题是否重复 if (ds.tables[0].rows.count < 1) parameters = new SqlParameter[6]; parameters[0] = new SqlParameter("@Title", TextBox1.Text. Trim()); parameters[1] = new SqlParameter("@Content", TextBox2.Text. Trim()); parameters[2] = new SqlParameter("@Keywords", TextBox3.Text. Trim()); parameters[3] = new SqlParameter("@AddTime", DateTime.Now. ToString()); parameters[4] = new SqlParameter("@Author", TextBox4.Text. Trim()); parameters[5] = new SqlParameter("@AuthorIP", ClientIP()); SqlHelper.RunProcedure("insert_NewsTable", parameters); // 调用存储过程 ScriptManager.RegisterStartupScript(UpdatePanel1, this. GetType(), "alert", "alert(' 添加成功!');location.replace ('Newsmanage.aspx')", true);

24 else ScriptManager.RegisterStartupScript(UpdatePanel1, this. GetType(),"alert","alert(' 新闻名称重复, 添加失败!')", true); catch (Exception) ScriptManager.RegisterStartupScript(UpdatePanel1,this.GetType(), "alert", "alert(' 添加失败!')", true); 通过代码可以看到,RunProcedure 函数对执行的存储过程没有要求, 以后需要执行存储过程的页面都可以调用此函数 (2) 查询操作查询操作是程序开发中重要的一环, 查询方法的优劣会影响用户体验是否满意, 对系统资源的使用也有很大影响下面以一个复合查询为例说明查询操作的一致性处理实例是一个新闻管理页面, 页面中包括三个 TextBox 控件一个查询按钮和一个 GridView 控件页面后台主要包括 GridView 绑定函数数据获取函数公共类函数 Query 和查询按钮单击函数, 代码分别如下 GridView 绑定函数代码 : private void GridView_Bind() DataTable dt = shuju(); DataView dv = new DataView(dt); dv.rowfilter = Session[" 新闻表 "].ToString(); Session[" 新闻表 fc"] = dv.totable(); com1.fenye1(dv.totable(), Label1, Label2, Label3, GridView1, LinkButton1, LinkButton2, LinkButton3, LinkButton4, Convert.ToInt32(Session ["pagesize"])); 数据获取函数如下 : private DataTable shuju() string str = "select * from NewsTable order by [NewsID] desc"; return SqlHelper.Query(str).Tables[0]; Query 函数代码 : 187 第 5 章一致性处理

25 ASP.NET 程序设计高级教程 188 /// <summary> /// 执行查询语句, 返回 DataSet /// </summary> /// <param name="sqlstring"> 查询语句 </param> /// <returns>dataset</returns> public static DataSet Query(string SQLString) using (SqlConnection connection = new SqlConnection(connectionString)) DataSet ds = new DataSet(); try connection.open(); SqlDataAdapter command=new SqlDataAdapter(SQLString, connection); command.fill(ds, "ds"); catch (System.Data.SqlClient.SqlException ex) throw new Exception(ex.Message); return ds; 查询按钮代码如下 : protected void btnqdxx_click(object sender, EventArgs e) if (txtoldtime.text == "" && txtnewtime.text == "") Session[" 新闻表 "] = "Title like '%" + gwid.text.tostring().replace ("'", "") + "%'"; else Session[" 新闻表 "] = "Title like '%" + gwid.text.tostring().replace ("'", "") + "%' and (AddTime>='" + txtoldtime.text + "' and AddTime<='" + txtnewtime.text + "') "; GridView_Bind(); 执行结果如图 5-7 所示

26 图 5-7 查询操作执行结果 (3) 编辑操作编辑操作的执行过程与添加操作类似, 只是在编辑操作开始阶段需要查询获取数据库数据, 此处也用到了 Query 函数 Query 函数应用代码编辑存储过程和编辑按钮的执行代码如下 Query 函数应用代码 : DataSet ds = SqlHelper.Query("select * from NewsTable where NewsID=@ 新闻编号 ", new SqlParameter[] new SqlParameter("@ 新闻编号 ", Request["NewsID"]) ); TextBox1.Text = ds.tables[0].rows[0][1].tostring(); TextBox2.Text = ds.tables[0].rows[0][2].tostring(); TextBox3.Text = ds.tables[0].rows[0][3].tostring(); TextBox4.Text = ds.tables[0].rows[0][5].tostring(); 编辑存储过程 : CREATE PROCEDURE nvarchar(50) AS UPDATE NewsTable set Title=@Title, Content=@Content, Keywords=@Keywords, AddTime=@AddTime, Author=@Author, AuthoriP=@AuthorIP 189 第 5 章一致性处理

27 ASP.NET 程序设计高级教程 where GO 190 编辑按钮代码如下 : protected void Button1_Click(object sender, EventArgs e) try if (TextBox1.Text.Trim() == "") ScriptManager.RegisterStartupScript(UpdatePanel1, this.gettype(), "alert", "alert(' 新闻名称不能为空!')", true); return; else SqlParameter[] parameters; parameters = new SqlParameter[1]; parameters[0] = new SqlParameter("@ 新闻名称 ", TextBox1.Text. Trim()); DataSet ds = SqlHelper.Query("select * from NewsTable where Title=@ 新闻名称 and NewsID!='" + Request["NewsID"].ToString() + "'", parameters); if (ds.tables[0].rows.count >= 1) ScriptManager.RegisterStartupScript(UpdatePanel1, this. GetType(),"alert", "alert(' 新闻名称重复, 修改失败!')", true); return; else parameters = new SqlParameter[7]; parameters[0] = new SqlParameter("@NewsID", Request ["NewsID"]. Trim()); parameters[1] = new SqlParameter("@Title", TextBox1.Text. Trim()); parameters[2] = new SqlParameter("@Content", TextBox2.Text. Trim()); parameters[3] = new SqlParameter("@Keywords", TextBox3.Text. Trim()); parameters[4] = new SqlParameter("@AddTime", DateTime.Now. ToString()); parameters[5] = new SqlParameter("@Author", TextBox4.Text. Trim()); parameters[6] = new SqlParameter("@AuthorIP", ClientIP());

28 SqlHelper.RunProcedure("update_NewsTable", parameters); ScriptManager.RegisterStartupScript(UpdatePanel1, this. GetType(), "alert", "alert(' 修改成功 ');location.replace ('Newsmanage.aspx')", true); catch (Exception) ScriptManager.RegisterStartupScript(UpdatePanel1, this.gettype(), "alert", "alert(' 修改失败 ')", true); (4) 删除操作删除操作主要用到了公共类函数 ExecSQL,ExecSQL 函数和删除按钮代码如下 ExecSQL 函数代码 : /// <summary> /// 说明 :ExecSQL 用来执行 SQL 语句 /// 返回值 : 操作是否成功 (True\False) /// 参数 :sqlstr SQL 字符串 /// </summary> public Boolean ExecSQL(string sqlstr) SqlConnection myconn = GetConnection(); myconn.open(); SqlCommand mycmd = new SqlCommand(sqlStr, myconn); try mycmd.executenonquery(); myconn.close(); catch myconn.close(); return false; return true; 删除按钮代码如下 : protected void GridView1_RowCommand(object sender, GridViewCommand EventArgs e) 191 第 5 章一致性处理

29 ASP.NET 程序设计高级教程 192 if (e.commandname == " 删除 ") com1.execsql("delete from NewsTable where NewsID='" + this.gridview1. DataKeys[Convert.ToInt32(e.CommandArgument)].Value.ToString()+"'"); GridView_Bind(); 分页实例中分页操作分为前台和后台部分, 前台主要是定义相关控件, 后台初始化部分是初始化 GridView 显示数据条数, 然后绑定 GridView 部分调用分页公共类函数, 最后是对前台分页 DropListDown 控件和按钮控件进行单击定义, 代码分别如下前台分页代码 : 显示数量 :<asp:dropdownlist ID="DropDownList_ 分页数量 " runat="server" AutoPostBack= "True" OnSelectedIndexChanged="DropDownList_ 分页数量 _SelectedIndexChanged"> <asp:listitem>10</asp:listitem> <asp:listitem>20</asp:listitem> <asp:listitem>50</asp:listitem> <asp:listitem>100</asp:listitem> <asp:listitem>200</asp:listitem> </asp:dropdownlist> 当前页码为 [<asp:label ID="Label1" runat="server" Text="1"></asp:Label> ] 页总页码 [<asp:label ID="Label2" runat="server" Text="1"></asp:Label> ] 共 [<asp:label ID="Label3" runat="server" Text="Label"></asp:Label> ] 条记录 <asp:linkbutton ID="LinkButton1" runat="server" OnClick="LinkButton1_ Click"> 首页 </asp:linkbutton> <asp:linkbutton ID="LinkButton2" runat="server" OnClick="LinkButton2_ Click"> 上一页 </asp:linkbutton> <asp:linkbutton ID="LinkButton3" runat="server" OnClick="LinkButton3_ Click"> 下一页 </asp:linkbutton> <asp:linkbutton ID="LinkButton4" runat="server" OnClick="LinkButton4_ Click"> 末页 </asp:linkbutton> 后台分页代码 : protected void Page_Load(object sender, EventArgs e) this.gwid.attributes.add("onkeydown", "SubmitKeyClick();");

30 PostBackTrigger trigger = new PostBackTrigger(); trigger.controlid="btndcexc";((updatepanel)page.controls[0].findcontrol ("ContentPlaceHolder1").FindControl("UpdatePanel1")).Triggers. Add(trigger); if (!IsPostBack) txtnewtime.attributes["contenteditable"] = "false"; txtnewtime.attributes.add("onfocus", "return new Calendar(). show (this);"); txtoldtime.attributes["contenteditable"] = "false"; txtoldtime.attributes.add("onfocus", "return new Calendar().show (this);"); if (Session["pageSize"] == null) Session["pageSize"] = "10"; DropDownList_ 分页数量.SelectedValue=Session["pageSize"].ToString(); Session[" 新闻表 "] = ""; GridView_Bind(); /// GridView 绑定函数 private void GridView_Bind() DataTable dt = shuju(); DataView dv = new DataView(dt); dv.rowfilter = Session[" 新闻表 "].ToString(); Session[" 新闻表 fc"] = dv.totable(); com1.fenye1(dv.totable(), Label1, Label2, Label3, GridView1, LinkButton1, LinkButton2, LinkButton3, LinkButton4, Convert.ToInt32 (Session ["pagesize"])); 分页公共类函数代码 : /// <summary> /// 说明 : 分页函数, 对 GridView 进行分页 /// 参数 : DataSource 数据源 /// Label1 当前页 /// Label2 总页码 /// Label3 总记录数 /// GridView1GridView 名称 /// LinkButton1 首页按钮 /// LinkButton2 上一页按钮 /// LinkButton3 下一页按钮 /// LinkButton4 末页按钮 /// </summary> public void FenYe(DataTable DataSource, Label Label1, Label Label2, Label 193 第 5 章一致性处理

31 ASP.NET 程序设计高级教程 194 Label3, GridView GridView1, LinkButton LinkButton1, LinkButton LinkButton2, LinkButton LinkButton3, LinkButton LinkButton4) LinkButton1.Enabled = true; LinkButton2.Enabled = true; LinkButton3.Enabled = true; LinkButton4.Enabled = true; int CurrentPage = Convert.ToInt32(Label1.Text); PagedDataSource ps = new PagedDataSource(); ps.datasource = DataSource.DefaultView; ps.allowpaging = true; ps.pagesize = 10; if (Convert.ToInt32(Label2.Text) < ps.pagecount) Label1.Text = "1"; Label2.Text = ps.pagecount.tostring(); if (Convert.ToInt32(Label1.Text) > Convert.ToInt32(Label2.Text)) Label1.Text = "1"; CurrentPage = 1; ps.currentpageindex = CurrentPage - 1; Label3.Text = DataSource.Rows.Count.ToString(); if (CurrentPage == 1) LinkButton1.Enabled = false; LinkButton2.Enabled = false; if (CurrentPage == ps.pagecount) LinkButton3.Enabled = false; LinkButton4.Enabled = false; GridView1.DataSource = ps; GridView1.DataBind(); /// DropDownList 更改函数 protected void DropDownList_ 分页数量 _SelectedIndexChanged(object sender, EventArgs e) Page.ClientScript.RegisterStartupScript(Page.GetType(), "", "<script language='javascript'defer>location='newsmanage.aspx?page=1';</script>"); Session["pageSize"] = DropDownList_ 分页数量.SelectedValue; GridView_Bind();

32 /// 首页按钮单击函数 protected void LinkButton1_Click(object sender, EventArgs e) Label1.Text = "1"; GridView_Bind(); /// 上一页按钮单击函数 protected void LinkButton2_Click(object sender, EventArgs e) Label1.Text = (Convert.ToInt32(Label1.Text) - 1).ToString(); GridView_Bind(); /// 下页按钮单击函数 protected void LinkButton3_Click(object sender, EventArgs e) Label1.Text = (Convert.ToInt32(Label1.Text) + 1).ToString(); GridView_Bind(); /// 末页按钮单击函数 protected void LinkButton4_Click(object sender, EventArgs e) Label1.Text = Label2.Text; GridView_Bind(); 运行结果如图 5-8 所示图 5-8 分页控件运行结果界面联想查询 ASP.NET 还可以实现联想查询功能, 即在查询文本框输入关键字的过程中实时筛选数据库相关记录, 并将符合条件的内容以下拉框的形式显示出来, 用户根据列出的选项选择需要的信息联想查询功能可以节约用户查询时间, 提高查询效率, 该功能目前在各大搜索网站 ( 如 Google 和百度 ) 都已应用下面以实例的形式说明联想功能的实现方法该实例主要实现用户登录时, 首先选择所属企业, 当企业较多时, 如果使用下拉框直接选择企业, 则效率较低下如果使用联想查询功能, 则可直接在文本框中输入企业名称或企业编号, 在输入的过程中逐步地筛选企业, 很快就会找到需要的企业本节实例包括模糊查询和下拉直接选择两种功能实例主要包括 : 一个 login 页面一个 ssqy.asmx 文件和一个 ssqy.cs 公共类 ; 数据库主要包括 : 一个企业表和一个视图实现时需要用到 AJAX 控件,AJAX 控件中的 ServicePath 设置为 ssqy.asmx,ssqy.asmx 中 Class 设置为 ssqy 用于 195 第 5 章一致性处理

33 ASP.NET 程序设计高级教程调用公共类 ssqy.cs login 页面前后台代码 ssqy.asmx 代码和 ssqy.cs 代码分别如下 login 页面前台代码 : 196 <%@ Page Language="C#" AutoEventWireup="true" CodeFile="login.aspx.cs" Inherits="login" %> <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns=" <head runat="server"> <title> 登录窗口 </title> <link href="css/autotextbox.css" rel="stylesheet" type="text/css" /> </head> <body style=" background-image:url(images/logobg2.gif); background-repeat: no-repeat;"> <div align="center" style=" vertical-align:top;"> <br/><br/><br/><br/><br/><br/><br/><br/><br/> <table cellpadding="0" cellspacing="0" border="0" style="backgroundimage:url(images/loginbg1.gif); background-repeat:no-repeat; width: 450px;height:300px;vertical-align:middle"> <tr> <td style="text-align:center;"> <table cellpadding="0" border="0" width="100%" cellspacing="0"> <tr> <td style="width:450px; height:50px; text-align:center; font-size: 14pt; color:white;"><b>asp.net 程序设计高级教程 </b></td> </tr> </table> </td></tr> <tr><td style="width:400px;border:0;height:200px;"> <table cellpadding="0" cellspacing="0"> <tr> <td style="text-align:center; width:150px;"></td> <td style="text-align:center; width:300px;"> <form id="loginform" runat="server"> <asp:scriptmanager ID="ScriptManager1" runat="server" Enable ScriptGlobalization="true" EnableScriptLocalization="true"> </asp:scriptmanager> <table cellpadding="0" cellspacing="0" style="height:230px" width="100%"> <tr><td align="center"> <table cellpadding="0" cellspacing="0" width="100%"> <tr> <td style="text-align:right; width:120px; height:40px; color:

34 White;"> 所属企业 :</td> <td style="vertical-align:middle; text-align:left;"> <span style="position:absolute;border:1pt solid #c1c1c1;overflow: hidden;width:168px;height:19px;clip:rect(-1px 170px 170px 150px);"> <asp:dropdownlist ID="userClassDrop" runat="server" DataSourceID= "SqlDataSource1" AutoPostBack="True" ontextchanged= "user ClassDrop_TextChanged" width="170" DataTextField=" 企业名称 " DataValueField=" 企业编号 " ></asp:dropdownlist> <asp:sqldatasource ID="SqlDataSource1" runat="server" ConnectionString= "<%$ ConnectionStrings:connectstring %>" SelectCommand="SELECT [ 企业编号 ], [ 企业名称 ] FROM [ 企业表 ] where 认证状态 =3"></asp:SqlDataSource> </span> <span style="position:absolute;border-top:1pt solid #c1c1c1; border-left:1pt solid #c1c1c1;border-bottom:1pt solid #c1c1c1;width:150px;height:19px;"> <asp:autocompleteextender ID="AutoCompleteExtender1" runat= "server" TargetControlID="ssqy" CompletionInterval="50" ServicePath="ssqy.asmx" Completion SetCount="10" MinimumPrefixLength="1" CompletionListCssClass="autocomplete_completionList Element" CompletionListItemCssClass="autocomplete_listItem" CompletionListHighlightedItemCssClass="autocomplete_highlighted ListItem" ServiceMethod="GetCompleteDepart"> </asp:autocompleteextender> <asp:textbox ID="ssqy" runat="server" AutoCompleteType= "Disabled" onfocus="if(this.value==' 请选择或输入企业名称 ') this.value=''; this.style.color='black'" onblur="this.value=this.value==''?' 请选择或输入企业名称 ':this.value;this.style.color=this.value== ' 请选择或输入企业名称 '?'Grey':'Black'" AutoPostBack="True" ontextchanged="ssqy_textchanged" Width="150px"></asp:TextBox> </span> </td> </tr> <tr> <td style="text-align:right;height:50px; color:white;" > 用户名 :</td> <td style="vertical-align:middle; text-align:left"> <asp: TextBox ID="AdminNameTxt" runat="server" Columns="19"> </asp:textbox> <asp:requiredfieldvalidator ID="AdminNameValR" runat= "server" ErrorMessage="*" ControlToValidate= "AdminName Txt"> </asp:requiredfieldvalidator> </td> </tr> 197 第 5 章一致性处理

35 ASP.NET 程序设计高级教程 198 <tr> <td style="text-align:right; height:50px; color:white;"> 密码 :</td> <td style="vertical-align:middle; text-align:left"><asp: TextBox ID="AdminPwdTxt" runat="server" Columns="20" TextMode="Password"></asp:TextBox> <asp:requiredfieldvalidator ID="AdminPwdValR" runat="server" ErrorMessage="*" ControlToValidate="AdminPwdTxt"></asp:Required FieldValidator> </td> </tr> <tr> <td style=" height:50px; text-align:right;"> <asp:imagebutton ID="LoginBtn" runat="server" ImageUrl= "images/denglu.gif"onclick="loginbtn_click"width="80"height ="43"/> </td> <td style="text-align:left;"> <asp:imagebutton ID="CancelBtn" runat="server" ImageUrl="images/cancel.gif" OnClick="CancelBtn_Click" Width= "80" Height="43" /> </td> </tr> </table> </td> </tr> </table> </form> </td> <td style="width: 1px"></td> </tr> </table> </td> </tr> </table></div> </body> </html> login 页面后台代码如下 : using System; using System.Collections; using System.Configuration; using System.Web; using System.Web.Security; using System.Web.UI; using System.Web.UI.HtmlControls;

36 using System.Web.UI.WebControls; using System.Web.UI.WebControls.WebParts; using System.Web.Configuration; public partial class login : System.Web.UI.Page CommonClass cocl = new CommonClass(); protected void Page_Load(object sender, EventArgs e) if (!Page.IsPostBack) DataLoad(); if (Request.Cookies["ssqy"] == null) this.ssqy.text = " 请选择或输入企业名称 "; else this.ssqy.text = Server.UrlDecode(Request.Cookies["ssqy"]. Value); #region 加载页面初始化数据 private void DataLoad() #region WebControls Config AdminNameTxt.EnableViewState = true; AdminPwdTxt.EnableViewState = false; #endregion #endregion #region 处理客户端回发数据 protected void LoginBtn_Click(object sender, EventArgs e) #endregion protected void CancelBtn_Click(object sender, EventArgs e) AdminNameTxt.Text = ""; AdminPwdTxt.Text = ""; protected void ssqy_textchanged(object sender, EventArgs e) try 199 第 5 章一致性处理

37 ASP.NET 程序设计高级教程 200 string qyma = ssqy.text.remove(0, ssqy.text.length - 10); catch (Exception) Response.Write("<script language=javascript>alert(' 请选择或输入所属企业! ');</script>"); protected void userclassdrop_textchanged(object sender, EventArgs e) try ssqy.text = userclassdrop.selecteditem.text + userclassdrop. SelectedValue; string qyma = ssqy.text.remove(0, ssqy.text.length - 10); catch (Exception) Response.Write("<script language=javascript>alert(' 请选择或输入所属企业! ');</script>"); ssqy.asmx 的代码如下 : <%@ WebService Language="C#" CodeBehind="~/App_Code/ssqy.cs" Class="ssqy" %> ssqy.cs 的代码如下 : using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.Services; using System.Data.SqlClient; using System.Data; using System.Collections; /// <summary> ///gangwei 的摘要说明 /// </summary> [WebService(Namespace = " [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] // 若要允许使用 ASP.NET AJAX 从脚本中调用此 Web 服务, 请取消注释 [System.Web.Script.Services.ScriptService] public class ssqy : System.Web.Services.WebService private string[] autocompletewordlist; [WebMethod]

38 public String[] GetCompleteDepart(string prefixtext, int count) if (string.isnullorempty(prefixtext) count <= 0) return null; if (autocompletewordlist == null) string str = "select * from 企业名称编号 where 企业名称编号 like '%" + prefixtext + "%'"; DataTable dt = Selectss(str); string[] temp = new string[dt.rows.count]; int i = 0; foreach (DataRow dr in dt.rows) temp[i] = dr[" 企业名称编号 "].ToString(); i++; Array.Sort(temp, new CaseInsensitiveComparer()); autocompletewordlist = temp; return autocompletewordlist; private string getconnectionstring()// 获取链接字符串 string conn; conn = "Data Source=.;Initial Catalog=examplechp5;Integrated Security= True;"; return conn; public DataTable Selectss(string sql) using (SqlConnection conn = new SqlConnection(getConnectionString())) conn.open(); SqlCommand comm = new SqlCommand(sql, conn); DataTable dt = new DataTable(); SqlDataAdapter ad = new SqlDataAdapter(comm); ad.fill(dt); return dt; 运行结果如图 5-9 和图 5-10 所示, 其中图 5-9 是联想查询, 图 5-10 是直接下拉列表框 201 第 5 章一致性处理

ASP.NET 程序设计高级教程选择 202 图 5-9 联想查询图 5-10 直接下拉列表框选择 5.3.

39 ASP.NET 程序设计高级教程选择 202 图 5-9 联想查询图 5-10 直接下拉列表框选择导出 Excel 导出 Excel 操作是把按条件查询出的信息导出到 Excel 表中, 以备后期处理和应用该功能主要包括导出按钮单击函数和公共类函数 CreateExcel, 代码分别如下公共类函数 CreateExcel 代码 : /// <summary> /// 连接数据库由 DataSet 导出数据库 /// </summary> /// <param name="req">httprequest 对象, 主要用来判断是否是火狐浏览器 </param> ///<param name="resp">httpresponse 对象 ( 调用时使用 Page.Response 即可 )</param> /// <param name="sqlstr">sql 语句 </param> /// <param name="filename"> 保存的文件名, 不带扩展名 </param> public void CreateExcel(HttpRequest req, HttpResponse resp, DataTable dt, string FileName) resp.contentencoding = System.Text.Encoding.GetEncoding("UTF-8"); if (req.useragent.tolower().indexof("firefox")!= -1) // 如果是火狐浏览器 resp.appendheader("content-disposition", "attachment;filename= "+"\""+FileName+".xls\""); else resp.appendheader("content-disposition","attachment;filename= "+HttpContext.Current.Server.UrlPathEncode(FileName+".xls")); string sout = "<table cellspacing='10' cellpadding='10' border='1'>"; string ot = ""; string head = ""; for (int j = 0; j < dt.columns.count; j++)

40 if (j == 0) head=head+"<tr><td>"+dt.columns[j].caption.tostring()+"</td>"; else if (j == dt.columns.count - 1) head=head+"<td>"+dt.columns[j].caption.tostring()+"</td></tr>"; else head=head + "<td>" + dt.columns[j].caption.tostring() + "</td>"; foreach (DataRow row in dt.rows) // 在当前行中, 逐列获得数据, 数据之间以 \t 分隔, 结束时加回车符 \n for (int j = 0; j < row.table.columns.count; j++) if (j == 0) ot = ot + "<tr><td>" + row[j].tostring() + "</td>"; else if (j == row.table.columns.count - 1) ot = ot + "<td>" + row[j].tostring() + "</td></tr>"; else ot = ot + "<td>" + row[j].tostring() + "</td>"; sout = sout + head + ot + "</table>"; HttpContext.Current.Response.Write(@"<style>.text mso-numberformat:\@; tdfont-size:12px;mso-number-format:\@; </style>"); resp.write(sout); resp.end(); 导出按钮代码 : protected void btndcexc_click(object sender, EventArgs e) 203 第 5 章一致性处理

ASP.NET 程序设计高级教程 204 string time = DateTime.Now.ToString("MM-dd");//time 为获取系统时间 string str = " 新闻表 " + time;//str 为导出的默认名字 DataView dv = new DataView((DataTable)Session[" 新闻表 fc"]); daochu.

41 ASP.NET 程序设计高级教程 204 string time = DateTime.Now.ToString("MM-dd");//time 为获取系统时间 string str = " 新闻表 " + time;//str 为导出的默认名字 DataView dv = new DataView((DataTable)Session[" 新闻表 fc"]); daochu.createexcel(page.request, Page.Response, dv.totable(), str); 单击导出 Excel 按钮后, 弹出图 5-11 所示的文件下载对话框, 用户可以选择直接打开或保存或取消操作图 5-11 文件下载对话框 5.4 小结本章讲解了 ASP.NET 编程中遇到的一些一致性处理方面的问题, 包括母版页及其嵌套菜单操作 CRUD 操作分页联想查询和导出 Excel 这些功能有些是 ASP.NET 自带的, 如母版页 ; 有些是经过二次开发实现的, 如联想查询和导出 Excel 等不管这些控件如何实现, 它们都有一个共同点, 那就是在一定程度上为程序设计人员提供了方便, 提高了程序开发效率和用户友好交互性能 5.5 习题作业题 1. 新建一个企业网站, 要求用到 MasterPage 母版页, 且至少含有两个母版页 : 前台母版页和后台母版页网站前台的菜单使用下拉式菜单, 一级菜单包括首页集团概况经营发展新闻中心社会责任集团文化集团产品和联系我们其中, 集团概况下的二级菜单有集团简介集团领导组织机构和资质荣誉等, 经营发展下的二级菜单有经营业务生产经营和财务报告, 新闻中心下的二级菜单有集团要闻特别关注和综合新闻, 集团产品下的二级菜单有产品展示产品推荐和销售渠道如图 5-12 和图 5-13 所示

42 图 5-12 母版页和下拉菜单应用图 5-13 母版页和网站后台 2. 在第 1 题的基础上, 对网站后台添加新闻管理页面 newsmanage.aspx, 创建新闻管理数据库, 要求自己编写新闻管理页面分页代码, 查询时实现联想查询功能, 如图 5-14 所示 205 第 5 章一致性处理

导出文件名按日期命名, 如图 5-15 所示图 5-15 导出到 Excel 功能 5.5.2 思考题如何高效正确地运用母版页的缓存技术?

43 ASP.NET 程序设计高级教程 206 图 5-14 分页和联想查询 3. 在第 2 题的基础上, 新闻管理页面添加导出按钮, 实现导出 Excel 功能, 导出文件名按日期命名, 如图 5-15 所示图 5-15 导出到 Excel 功能思考题如何高效正确地运用母版页的缓存技术? 5.6 上机实践参考节和节, 练习母版页的应用嵌套和动态访问

Microsoft Word - Ch06.docx

Microsoft Word - Ch06.docx Chapter 6-1 6-2 6-2 l ASP.NET 6-1 (theme) ASP.NET (skin).skin ButtonLabelHyperLink (cascading style sheet).css TreeView 1. 2. (page theme) (global theme) IIS l 6-3 6-1-1 (page theme) (global theme) App_Themes