Dreamweaver构建Blog全程实录

转载 2007年10月09日 23:52:00

BLOG,就是“网络日志(Web Log)”。Blog通常是由简短且经常更新的Post所构成;这些张贴的文章都按照年份和日期排列。Blog的内容和目的有很大的不同,从对其他网站的超级链接和评论,有关公司、个人、构想的新闻到日记、照片、诗歌、散文,甚至科幻小说的发表或张贴都有。许多Blog是个人心中所想之事情的发表,其它Blog则是一群人基于某个特定主题或共同利益领域的集体创作。

本文将使用Dreamweaver MX 2004 + Asp.net + Access组合,通过一个完整实用的例子,向读者介绍如何无需编写代码,制作“五脏俱全”的Blog。

 

Blog实例效果图

 了解Doking’s BLOG功能和开发目的之后,接下来就是构建好开发环境。

2.1  ASP.NET运行环境的构建

  在开始开发Doking’s BLOG前,应该先构造好开发环境。下面介绍的是在Windows 2000/XP操作系统中的构建方法。

  2.1.1 安装IIS服务器

  按【开始】→【控制面板】→【安装/删除Windows组件】,勾选“安装Internet信息服务组件”,如图2-1所示。

图2-1  windows组件向导对话框

  2.1.2 在IIS服务器上,给Doking’s BLOG安上新家

  (1)首先在D:/下新建目录“dkblog”,打开【控制面板】→【管理工具】→【Internet 服务管理器】,打开【Internet信息服务】对话框,如图2-2所示。

图2-2  Internet信息服务对话框

  (2)右键单击“默认Web站点”,选择属性,打开【默认Web站点属性】对话框,在对话框中,单击【主目录】选项卡,把本地路径指向“D:/dkblog”,在“执行许可(P):”下拉菜单中选择“脚本和可执行程序”,结果如图2-3所示。

图2-3  站点属性对话框

  (3)现在,电脑终于可以在像网络服务一样提供WWW服务了,默认网址:localhost或电脑的IP地址(如:127.0.0.1)。

  提醒:大家可不要小看Internet服务器的管理,如果能合理分配好IP地址和站点虚拟目录,也能让电脑真正成为网络服务器,也能让网络上的用户浏览电脑上的网站和数据库。

  2.1.3 安装.NET框架

  大家可以在微软的网上下载.NET Framework 2.0和相应版本的SDK工具包,也可以从下面网址下载安装:

  .NET Framework Version 2.0 Redistributable Package Beta 1 (x86) – 24M
http://go.microsoft.com/fwlink/?linkid=30093&clcid=0x409

  .NET Framework 2.0 SDK Beta 1 x86 – 229M
http://www.microsoft.com/downloads/details.aspx?familyid=916EC067-8BDC-4737-9430-6CEC9667655C&displaylang=en

  打开IE浏览器,在地址栏上打上“localhost/text.aspx”,假定text.aspx这个文档现在不存在,那么IE浏览器上一定会返回错误信息,如果出现如图2-4所示的错误信息,说明我ASP.NET的运行环境基本构建完毕。

图2-4  找不着文件错误信息

  2.1.4 在Windows 2003操作系统中构建ASP.NET运行环境

  上面介绍的是在Windows 2000/XP操作系统中构建ASP.NET运行环境的步骤和方法。在Windows 2003操作系统中构建ASP.NET运行环境主要有以下两种方法:

  1.使用【配置您的服务器向导】安装IIS 6.0和ASP.NET

  (1)从【开始】菜单,单击“管理您的服务器”。
  (2)在“管理您的服务器角色”下,单击【添加或删除角色】。
  (3)阅读“配置您的服务器向导”中的预备步骤,然后单击“下一步”。
  (4)在“服务器角色”下,单击“应用程序服务器(IIS,ASP.NET)”,然后单击“下一步”。
  (5)在【应用程序服务器选项】对话框中,选中“启用ASP.NET”复选框,单击“下一步”,然后再单击“下一步”。
  (6)阅读概要信息,然后单击“下一步”。
  (7)单击“完成”。

  2.使用【控制面板】安装IIS 6.0和ASP.NET

  (1)从【开始】菜单,单击【控制面板】。
  (2)双击【添加或删除程序】。
  (3)单击【添加/删除Windows组件】。
  (4)在“组件”列表框中,单击“应用程序服务器”。
  (5)单击“详细信息”。
  (6)单击“Internet信息服务管理器”。
  (7)单击“详细信息”以查看IIS可选组件的列表。
  (8)选择要安装的所有可选组件。
  (9)单击“确定”,直到返回到【Windows 组件向导】。
  (10)单击“下一步”,然后完成【Windows 组件向导】。

  另外,可以在运行Windows 2003的服务器中的 IIS 管理器中直接启用ASP.NET,具体步骤如下:

  (1)从【开始】菜单中,单击“运行”。
  (2)在【运行】对话框中的【打开】框中,键入inetmgr,然后单击“确定”。
  (3)在IIS管理器中,展开本地计算机,然后单击“Web服务扩展”。
  (4)在右侧窗口中,右键单击“ASP.NET”然后单击“允许”。ASP.NET的状态变为“允许”。

2.2  建立Doking’s BLOG 站点

  在构建好ASP.NET运行环境之后,可以开始着手开发Doking’s BLOG网站了。首先,必须在Dreamweaver MX中建立Doking’s BLOG站点。

  2.2.1 建立Doking’s BLOG站点

  (1)启动Dreamweaver MX 2004,切换到【文件】面板,单击“管理站点”,单击按钮“新建”,如图2-5所示。

图2-5  管理站点对话框

  (2)在其下接菜单中,选择“站点(S)”,在弹出对话框中,输入站点名字“dkblog”,结果如图2-6所示。

图2-6  定义站名字

  (3)单击“下一步”,选择“是,我想使用服务器技术。(Y)”,在“哪种服务器技术?(W)”下拉菜单中,选择“ASP.NET VB”,结果如图2-7所示。

图2-7  确定服务器技术

  (4)单击“下一步”,选择“在本地进行编辑和测试(我的测试服务器是这台计算机)(E)”,把文件存储指向“D:/dkblog”,如图2-8所示。

  (5)单击“下一步”,输入URL地址“http://localhost/”,单击按钮“测试URL(I)”,如果测试成功,会显示如图2-9一样的对话框。

图2-8  指定网站的目录位置

图2-9  测试对话框

  (6)单击“下一步”,再单击“下一步”,单击按钮“完成”,完成站点的建立。

  2.2.2 部署Doking’s BLOG站点

  (1)先来看Doking’s BLOG网站的布局,根目录存放.aspx、.htm文件;bin目录是用于部署DreamweaverCtrls.dll控件;dat目录用于存放数据库;images目录存放有关图片文件。在打开文件面板,在“站点—dkblog”下分别新建目录bin、目录dat、目录images,结果如图2-10所示。

  (2)在【文件】菜单中,选择【新建】,在【新建对话框】中,选择类别为“动态页”,选择动态页为“ASP.NET VB”,按“创建”按钮创建第一个动态网页。切换到【应用程序】面板,选择【绑定】选项卡,如图2-11所示。

  

图2-10  站点的布局                 图2-11  绑定对话框

  (3)点击“部署”二字,在弹出对话框中把部署目录指向“D:/dkblog/bin/”,如图2-12所示。

  (4)点击“部署”按扭,弹出如图2-13的对话框,按“确定”按钮将它关闭。

图2-12  部署设置对话框

 

图2-13  部署文件对话框

  提醒:切记DreamweaverCtrls.dll文件名称及其所在目录bin名称不能更改,并且bin文件夹必须保存在站点的根目录下。

 

3.1 数据库的规范化

  数据库的规范化主要体现在表与表之间的关系、数据结构及存储两大方面。

  3.1.1 数据表之间的关系

  许多初学者常常认为,建立一个表储存所有数据就可以了。如果这么认为,那经常会造成数据冗余的。图3-1-1是一个数据表,可以看到画在红色圈中的数据是冗余的。

图3-1-1  一个数据表

  冗余数据会影响数据库的有效运行,甚至可以把数据库推毁。为减少冗余数据,得把数据分开储存成几个表,并建立表与表之间的连接关系。表与表之间的连接关系,主要有一对多、多对多、一对一三种方式。

  一对多关系,它是数据库中最普通的关系类型。这种关系双被称为是父表与子表关系或主表与分表关系。图3-1-2就体现了一种父表与子表关系。在这里,专题表与回复表就是一对多的关系。专题表是父表,回复表是子表,专题表中的一行在回复表可有零行、一行或许多与之对应,而回复表中的每一行都与专题表中的相应的专题对应。

图3-1-2   一对多关系

  多对多关系,就是第一张表的每一行可对应第二张表的许多行,同样地,第二张表中的每行也可与第一第表中的许多行相对应。例如,一个专题可以有许多用户回复,一个用户也可以作多次专题回复。这就需要建立第三张表,将专题代码与用户代码连接,这个表就是前两个表的父表。在图3-1-3中,“回复表”就是“专题表”与“用户表”的父表。

图3-1-3  多对多关系

  一对一的关系,就是将一个表中的行与另一表中的行连接来。这种关系非常少见,因为如是有的话,还不如把这两个表合为一张表更为合理。

  3.1.2 数据结构与储存

  数据库的物理结构必须基于逻辑结构建立的,在设计表格、字段和关系时就需记住一些规则。行与列的顺序并不起什么作用,虽然在数据表中,列会有一定的顺序位置,但它们并不以此来代表引用顺序。记录的顺序只有在它们从数据表中取出并送给用时才起作用。SQL会通过参数数据库索引来处理记录的提取顺序。例如,在数据表中,把性别字段放在姓名字段之前,这个错误没什么,只要在采用SQL语句调用这个数据表时,记得把姓名字段调到性别字段之前就可以了。

  设计数据表时,分配字段大小要慎重,在够用的情况下,能省就省。如果字段用于储存整数,请用整数或长整数,不用单精度或双精度,如果够用的话,最好建立100字符的文本类型字段,而不要采用备注字段。为什么?如果你不怕高昂的服务器费用、不怕网络数据库运行缓慢,你大可不必理会这些,但它最严重会导致数据库崩溃。

3.2  Doking’s BLOG数据库的设计

  基于上述数据库规范化的知识,这节开始规划设计Doking’s BLOG数据库。Doking’s BLOG数据库中设计了五个数据表,分别是LM表(栏目表)、ZT表(学习笔记表)、HF表(回复表)、YH表(用户表)、GLY表(管理员表),并把数据库命名为“dkblog.mdb”,保存在“D:/dat/”目录下。

  LM表即栏目表,用于网站导航条建立和学习笔记的归类,栏目内容是由网站的管理员设计的,其字段设计如图3-2-1所示

图3-2-1  LM表的字段设计图

  ZT表即学习笔记表,是用于储存用户发表学习心得,其实字段设计如图3-2-2所示:

图3-2-2  ZT表的字段设计图

  HH表即回复表,储存着用户对已发表的学习笔记的回复,其字段如图3-2-3所示:

图3-2-3  HF表的字段设计图

  YH表即用户表,储存着用户的注册信息,方便用户登录发表学习笔记和学习笔记的回复。其字段设计如图3-2-4所示:

图3-2-4  YH表的字段设计图

  GLY表即管理员表,用于管理员登录,管理网站,其字段设计如图图3-2-5

图3-2-5  GLY表的字段设计图

 3.3 创建Doking’s BLOG数据库连接源
 

  (1)启动Dreamweaver MX 2004,在【文件】菜单中,选择【新建】,在【新建对话框】中,选择类别为“动态页”,选择动态页为“ASP.NET VB”,按“创建”按钮,创建一个动态网页。

  (2)切换到【应用程序】面板,选择【数据库】选项卡,单击“+”号,选择“OLE DB连接”,如图3-3-1所示:

图3-3-1 选择OLE DB连接

  (3)在弹出【OLE DB连接】对话框中,输入连接名称“dkconn”,单击“建立”按钮,如图3-3-2所示:

图3-3-2  设置连接名称

  (4)进入【数据连接属性】页面,选择【选择程序】选项卡,由于要连接的数据库是Access2003的数据库,所以在数据库引擎中选择“Microsoft Jet 4.0 OLE DB Provider”作为驱动程序,如图3-3-3所示:

图3-3-3 选择数据库引擎

  (5)选择【连接】选项卡,选择要连接数据库为“D:/dkblog/dat/dkblog.mdb”,把“用户名”和“密码”的文本框清空,如图3-3-4

图3-3-4 选择连接数据库

  (6)选择【高级】选项卡,在设置访问权限中,选择“ReadWrite”,如图3-3-5所示

图3-3-5  设置访问权限

  (7)返回【连接】选项卡,单击“测试”按钮,出现如图3-3-6对话框,那说明已经把数据库dkblog.mdb连接到站点上了。单击“确定”按钮完成数据库的连接工作。在站点的根目录下面,可以看到增添了一个新文件“web.config”,以后可以在这个文件直接对数据库的连接进行修改。

图3-3-6  数据库测试对话框

3.4  连接对话框中的“建立”按钮无效的解决

  如果您在3.3节中的第(3)步骤中单击【建立】按钮,【数据链接属性】对话框不打开。单击【建立】按钮时没有任何反应。导致此问题的一个原因可能是 MDAC 2.8;XP SP2 中默认包含着 MDAC 2.8。XP SP1 用户如果安装了 MDAC 2.8,则也会受到此问题的影响。此问题只影响 Dreamweaver MX 2004,而对 Dreamweaver MX 没有影响。有两种解决方法:

  第一种方法:接3.3节中的步骤中第(3)步骤,在【OLE DB 连接】对话框中的【连接字符串】文本区域中输入:

Provider=Microsoft.Jet.OLEDB.4.0;DataSource=D:/dkblog/dat/dkblog.mdb;Persist Security Info=False

  第二种方法:在硬盘上创建一个新的文本文件,将文件的扩展名由 .txt 更改 .udl,然后打开 .udl 文件。该文件可以打开【数据链接属性】对话框。其具体操作如下:

  ①接3.3节中的步骤中第(3)步骤。执行【开始】|【所有程序】|【附件】|【记事本】系统菜单命令。

  ②在记事本程序主窗口中,直接执行执行【文件】|【保存】菜单命令,在弹出【另存】对话框中的输入文件名为数据库连接.udl,如图3-4-1所示。

图3-4-1  保存“数据库连接.udl”

  ③点击【保存】按钮,关闭记事本程序,切换到【桌面】中,双击“数据库连接”这个文件,按照教程中第(4)—(7)进行操作。单击【确定】按钮,关闭【数据库链接】对话框。

  ④执行【开始】|【所有程序】|【附件】|【记事本】系统菜单命令。在记事本程序主窗口中,直接执行执行【文件】|【打开】菜单命令,选择“数据库连接”为打开文件。

  ⑤在记事本程序主窗口中,选择第三行所有字符进行复制,如图3-4-2所示。切换到Dremweaver程序中,将其粘贴到第(3)步骤的在弹出【OLE DB连接】对话框中的【连接字符串】文本区域中,这样就完成在Dreamweaver中的数据库链接。

图3-4-2  复制“数据库连接”文件中的第三行所有字符

 

4.1  基本页面设计

  这里,不是要谈网页艺术创造的知识,而是讲解在Dreamweaver MX2004中构建网站内页的思路和方法。

  4.1.1 网站设计思路

  每个网页开始前,一般要在Firworks或在Photoshop等图像设计软件中设计好基本页面设计,图4-1-1就是Photoshop中设计好的基本页面设计图。

图4-1-1  Doking’s BLOG基本页面设计图

  在图4-1-1中序号①画上红色方圈部分的是网页的左边栏目,目前是空白的,它的栏目在以后章节中会一一添加上去的,序号②画上红色方圈部分的是网站的导航条,它是由第三章建立的dkblog.mdb数据库中的LM表动态生成的。基本思路已清楚后,开始构建立网站的模板。

  4.1.2 构建网站模板

  设计思路:构建网站模板,统一网站网页设计。网站的栏目菜单内容由于数据表动态LM生成,也方便网站栏目菜单内容的修改。

  (1)打开【文件】→【新建】,打开【新文档】的对话框,选择“类别:”为“模板页”,选择“模板页:”为“ASP.NET VB 模板”,结果如图4-1-2所示。

图4-1-2  新建模板对话框

  (2)单击“创建”按钮,插入图层,在其属性窗口中,把ID设为“main”,把“左(L)”和“上(T)”设为0px,把“宽(W)”设为100%,把对齐方式设为居中。这样是为了把网页居中。

  (3)插入一个表格,把ID设为“bodyT”,设宽为780像素(这个是根据你的基本页面设计图的宽度而设计的),单位格的边距和间距设置为0,边框粗细设为0。

  (4)把“bodyT”表格第二行的垂直对齐方式设为顶端,再拆分为2列,第1列的宽度设为220px,第1列的宽度设为560px(分配列的宽度也是根据你的基本页面设计图而分配的),把第1列的背景颜色设为RGB(236,236,236)。

  (5)给“bodyT”表格的第一、三行分别插入相应的背景图,把第一行的的垂直对齐方式设为底部,水平对齐方式设为右边。

  (6)还可以根据需要设计好标题、字体大小,连接字体的颜色或或配色方案等。

  (7)建立网站的导航条。

   ①启动Access2003,打开dkblog.mdb数据库,在LM表的LM字段中按顺序输入平面设计、3D设计、网页设计、网络编程等4个记录,如图4-1-3 所示。

图4-1-3  LM表数据录入

  ②返回Dreamweaver,切换到【服务器行为】面板,单击“+”按钮,在下拉菜单中选择“数据集”,如图4-1-4所示。

图4-1-4  添加数据集

  ③在弹出【数据集】对话框中,输入数据集名称为“menuda”,在连接下拉菜单中选择“dkconn”,在表格的下拉菜单中选择LM表,选择列为“全部”选项,在排序下拉菜单中选择字段“LMID”,设排序为升序,结果如图4-1-5所示:

图4-1-5 数据集对话框

  ④单击“测试”按钮,出现如图4-1-6所示的对话框,说明数据集创建成功,单击“确定”按钮完成。

图4-1-6 数据集测试对话框

  ⑤切换到【绑定】选项卡,展开数据集(menuda)的字段,如图4-1-7所示:

图4-1-7  绑定选项卡

  ⑥拖拉LM字段至表格bodyT的第一行,如图4-1-8所示:

图4-1-8拖拉LM字段

  ⑦放开鼠标,这时第一行会增加一段带阴影的字符:{menuda.LM},在其前输入“主页 | ”,其后输入符号“ | 联系我们”,结果如图4-1-9所示:

图4-1-9  绑定数据到bodyT表中

  ⑧选择带阴影字符{menuda.LM}和后面的字符“ | ”,选择【插入】菜单→【应用程序对象】→【重复区域】,在弹出【重复区域】的对话框中选择数据集为“menuda”,把显示记录选为“所有记录”,如图4-1-10所示,单击“确定”按钮完成网站导航菜单。

图4-1-10 重复区域对话框

  (7)把鼠标移到表格bodyT第二行第二列,选择【插入】菜单→【模板对象】→【可编辑区域】,在【新建可编辑区域】对话框中,输入名称为“mainbody”,按下“确定”键,如图4-1-11所示:

图4-1-11  新建可编辑区域

  这样就完成网站模板的初期工作,保存模板为bkblog.dwt.aspx。

  4.1.3 首页的页面设计

  设计思路:完成网站的模板建设工作后,得以它来构建网站和更新网站。

  (1)新建“ASP.NET VB” 动态页,打开【修改】菜单→【模板】→【应用模板到页】,在弹出的【选择模板】对话框中,选择模板“dkblog”,单击“选择”按钮,如图4-1-12所示:

图4-1-12  选择模板

  (2)把鼠标移到“mainbody”可编辑区域中,插入表格,设其ID为“ztre”,其实它设计成如图4-1-13所示,这是每一个学习笔记将要显示的内容。

图4-1-13  每一个学习笔记将要显示的内容

4.2 插入数据集

  这一节讲解的插入数据集可没有上一节讲解的那么简单。首先看看图4-1-13,每个学习笔记将要显示主题、发表时间、笔记分类(即所属分栏目)、作者(姓名)、回复(个数),再来看看ZT表其设计图(3.2节中的图3-2-2),只有LMID(分类栏目的ID),没有栏目名,这个要连接LM表才能取得;只有YHID(发表者的ID),没有作者的姓名,这个要连接YH表才能取得;其它都可以从ZT表中获得数据。“好复杂啊!”其实不用担心,在Access中就可以解决一切困难。

  4.2.1 建立数据表连接查询

  (1)启动Access2003,选择【查询】→双击【在设计视图中创建查询】,在弹出的【显示表】窗口,如图4-2-1所示:

图4-2-1  添加查询连接表

  (2)按次序分别添加LM表、ZT表、YH表, 结果如图4-2-2所示:

图4-2-2  数据表连接视图

  (3)把查询字段设计为,如图4-2-3所示:

图4-2-3  查询字段设计图

  (4)保存这个查询为ZTRE,完成在Access中数据表连接查询。

  4.2.2 插入数据集

  (1)返回到Dreamweaver,切换到【服务器行为】面板,单击“+”按钮,添加数据集Ztre,选择表格为刚才在Access中新建的查询ZTRE,其它的有关设置,如图4-2-4所示:

图4-2-4  Ztre数据集的设置

  (2)切换到【绑定】选项卡,展开数据集(Ztre),拖拉字段ZTNAME替换表格ztre中的“学习笔记主题”,拖拉字段ZTTIME替换“发表时间”,拖拉字段LM替换“分类”,拖拉字段ZYTEXT到表格ztre的第二行空白处,其他设计如图4-2-5所示:

图4-2-5  绑定数据到ztre表中

  (3)切换到【服务器行为】面板,可以看已增添了许多动态文本,双击动态文本(Ztre.ZYTEXT),选格式为“编码—HTML编码格式”,如图4-2-6所示:

图4-2-6 设动态文本格式

  (4)选择表格ztre的第一、二、三行,并把它们定义的重复区域,其设置如图4-2-7所示。

图4-2-7  定义重复区域

  这样就完成了主页插入数据集和数据绑定工作。

4.3 分页显示

  (1)选择“首页”,在【服务器行为】面板,单击“+”按钮,选择【数据集分页】→【移至第一页】,如图4-3-1所示:

图4-3-1  数据集分页菜单

  (2)在弹出的对话框中,选择数据集为Ztre,按“确定”键,如图4-3-2所示:

图4-3-2  移至第一页对话框

  (3)选定“前一页”,定义为数据集分页的“移至前一页”;选定“后一页”,定义为数据集分页的“移至下一页”;选定“最后”,定义为数据集分页的“移至最后一页”。

  (4)把“页码”改为“当前页码:”在【服务器行为】面板,单击“+”按钮,选择【显示记录记数】→【显示当前页号】。

  (5)保存了index.aspx,这样就完成了首页的设计工作,在Access中给相应ZT表、YH表随便输入几个记录,进行IE浏览器中浏览(下面的章节中如无特别说明,笔记全属于“网络编程”栏目),大概如图4-3-3所示:

图4-3-3 首页浏览图

5.1  笔记菜单分栏实现

  设计思路:修改模板bkblog.dwt.aspx中菜单分栏的超级链接,进而更新所有网页;打开首页时,浏览按时间降序方式显示所学习笔记的内容,点击菜单分栏,又能根据分栏进行按时间降序方式分类显示学习笔记内容。

  5.1.1 建立模板菜单

  (1)打开模板bkblog.dwt.aspx,选择动态文本(menuda.LM),创建超级链接,链接到首页(index.aspx),选择【代码显示视图】,把鼠标移至如图5-1-1所示的红色垂直线的地方。(下面没有特别说明所有符号都是英文字符)

图5-1-1  鼠标移至到链接属性

  (2)输入“?menanw=”(menanw就是的参数变量),切换到【绑定】面板,拖拉数据集(menuda)下的字段LMID到到刚才输入的等于号后面,结果如图5-1-2所示:

图5-1-2 插入动态属性(a.href)

  (3)切换到【服务器行为】面板,可以看已经增加一个服务器行为:动态属性(a.href),如图5-1-3所示:

图5-1-3 服务器行为面板

  (4)选择“主页”菜单,创建链接到index.aspx;选择“联系我们”,创建链接到mailto:wen110@21cn.com。

  (5)保存bkblog.dwt.aspx模板,这时会弹出如图5-1-4所示的对话框。

图5-1-4  更新模板文件对话框。

  (6)单击“更新”按钮,完成笔记菜单分栏,并更新首页index.aspx。

  5.1.2  在首页中实现分栏显示

  (1)打开首页index.aspx,切换到【服务器行为】面板,双击数据集(Ztre),在弹出的数据集对话框中,单击“高级”按钮,如图5-1-5所示。选择【SQL】文本区域中的SQL命令进行复制,建议把它粘贴到新建立的记事本或Word文本中,它在以后步骤中将会有很大作用(熟悉SQL语言,可以跳过此步骤)。

图5-1-5  数据集高级对话框

  (2)单击“简单”按钮,在【筛选】下拉菜单中选择筛选字段为LMID,选“URL参数”作为参数传递方式,输入参数变量为menanw,按“确定”键,结果如图5-1-6所示:

图5-1-6  修改Ztre数据集为筛选

  (3)对首页进行IE浏览,浏览结果没有记录,如图5-1-7所示

图5-1-7  首页浏览图

  (4)在首页IE浏览中,单击链接“网络编程”,结果如上章的图4-3-3所示,显示出所有网络编程的学习笔记。

  “等等,这与原先的设计思路不符合!只有按分栏显示,不能显示所有学习笔记!”这里还有个ASP.NET页间数据传递的问题:Windows应用程序中的各Form窗体间数据传递可以通过定义全局变量(Public static 变量)等方法来实现。而这些方法却无法用以ASP.NET中各Web页面数据传递。例如:当点击数据集导航条会有个Ztre_currentPage的数据传递,却不能传递menanw的数据,也就是说当点击数据集导航条的任何一个超级链接,menan传递的数据永远是空值,这就不能既实现分栏显示,又同时进行在分栏下的分页显示。这里是采取session进行参数传递的方法解决。

  (5)为了把参数变量menanw传递给session("menanw"),切换到代码视图,在<html>标签之前,插入如图5-1-8红色圈中所示的代码。

图5-1-8  给index.aspx插入页面载入默认函数

  (6)在【服务器行为】面板中选择数据集(Ztre),如图5-1-9所示,带黑色部分的就是数据集(Ztre)定义代码。

图5-1-9  数据集Ztre的代码

  (7)找到代码:

CommandText='<%# "SELECT * FROM ZTRE WHERE LMID = ? ORDER BY ZITIME ASC" %>'

  把上面的代码改为:

CommandText='<%# IIf(((request.QueryString("menanw")<>nothing) or Request.QueryString("Ztre_CurrentPage") <> Nothing),"SELECT * FROM ZTRE WHERE LMID = ? ORDER BY ZITIME DESC","SELECT * FROM ZTRE  ORDER BY ZITIME DESC") %>'

  (8)找到代码:

<Parameter  Name="@LMID"  Value='<%# IIf((request.QueryString("menanw") <> Nothing), request.QueryString("menanw"), "") %>'  Type="Integer"   /></Parameters></MM:DataSet>

  把上面的代码改为:

<Parameter  Name="@LMID"  Value='<%# IIf((session("menanw") <> Nothing), session("menanw"), "") %>'  Type="Integer"   /></Parameters></MM:DataSet>

  (9)进行IE浏览,结果第四章的图4-3-3所示。完成既定的设计思路。

  

5.2  回复页面的实现

  设计思路:能够实现点击笔记的标题,就能够够链接出一个页面,包括这笔记和相应所有回复。从上一节,可以这已不难了,只在笔记标题的超级链接上进行这个笔记的代码参数传递就可以实现了。

  5.2.1  基本页面设计

  (1)新建由模板bkblog.dwt.aspx生成的ASP.NET VB 动态页hf.aspx,在mainbody可编辑区域中插入表格ztre,并进行有关设计,结果如图5-2-1所示:

图5-2-1 表格ztre设计图

  (2)启动Access2003,建立FH表、YH表连接查询HFRE,其实连接视图及显示字段如图5-2-2所示。

图5-2-2  查询HFRE的有关设计

  (3)按4.2.2数据集那节中(1)-(3)步骤,添加数据集Ztre,拖拉字段到相应位置,并进行动态文本(Ztre.ZYTEXT)的格式设置,结果如图5-2-3所示:

图5-2-3  绑定数据到表格ztre

  (4)修改数据集Ztre为筛选,筛选字段为ZTID,选“URL参数”作为参数传递方式,输入参数变量为ztanw。

  (5)添加数据集Hfre,筛选字段为ZTID,选“URL参数”作为参数传递方式,输入参数变量为ztanw,结果如图5-2-4所示:

图5-2-4  数据集Hfre的设计

  (6)拖拉数据集Hfre字段到表格ztre的相应位置,设动态文本(Htre.HFTEXT)的格式设置“编码—HTML编码格式”,将表格ztre的第5、6、7行,定义为重复区域,定义数据分页到表格ztre,结果如图5-2-5所示:

图5-2-5  绑定数据集Htre到表格ztre中

  (7)打开首页index.aspx,选择动态文本(Ztre.ZTNAME),创建超级链接,链接到hf.aspx,切换到代码视图,把链接属性改为:hf.aspx?ztanw=,拖拉数据集Ztre下的字段ZTID到等于号之后,结果如图5-2-6所示:

图5-2-6 在代码中添加动态超级链接

  (8)保存hf.aspx和index.asps,在Access中给相应HF表、YH表随便输入几个记录,进行IE浏览器中浏览index.asps,点出有回复的学习笔记主题,如图5-2-7所示:

图5-2-7  回复页的显示

  (9)再点击数据集导航的任何一个超级链接,结果如图5-2-8所示:

图5-2-8  点击数据集导航后页面结果

  啊!全没了!这就是ASP.NET网页间数据传递的问题。得像5.1节中那进行修改。

  (10)切换到代码视图,在<html>标签之前,插入如图5-2-9红色圈中所示的代码。

图5-2-9  给hf.aspx插入页面载入默认函数

  (11)找到数据集Ztre中的代码:

  <Parameter  Name="@ZTID"  Value='<%# IIf((request.QueryString("ztanw") <> Nothing), request.QueryString("ztanw"), "") %>'  Type="Integer"   /> 

  把上面代码中request.QueryString("ztanw")替代为session("ztanw"),结果代码修改为

<Parameter  Name="@ZTID"  Value='<%# IIf((session("ztanw")<> Nothing), session("ztanw"), "") %>'  Type="Integer"   />

  (12)找到数据集Hfre中的代码:

  <Parameter  Name="@ZTID"  Value='<%# IIf((request.QueryString("ztanw") <> Nothing), request.QueryString("ztanw"), "") %>'  Type="Integer"   /> 

  把上面代码中request.QueryString("ztanw")替代为session("ztanw"),结果代码修改为

<Parameter  Name="@ZTID"  Value='<%# IIf((session("ztanw")<> Nothing), session("ztanw"), "") %>'  Type="Integer"   />

  (13)保存hf.aspx。

  

6.1  基本页面设计

  6.1.1 模板bkblog.dwt.aspx页面的修改

  (1)打开模板bkblog.dwt.aspx,在左边栏目插入表格Lefttab,在第一行中插入表单Yhlogfrm,在表单Yhlogfrm中插入表格logtab,并插入有关文本框、文本区域及按钮,结果如图6-1-1所示:

图6-1-1  模板中用户登录设计

  (2)将作者相应的文本框命名为Logname;将密码相应的文本框命名为Logpass,类型改为密码;“注册”按钮的动作改为“无”;把“登录”按钮的动作改为“提交表单”。

  (3)选择按钮“注册”按钮,在【行为】面板中,添加行为转到URL,在弹出的对话框中,输入链接为“../yhinlog.aspx” 如图6-1-2所示:

图6-1-2  添加转到URL的行为

  (4)保存模板,更新所有的网页。

  6.1.2  注册页面的设计

  (1)新建由模板bkblog.dwt.aspx生成的ASP.NET VB 动态页yhinlog.aspx,在mainbody可编辑区域中插入表单Yhinfrm,再插入表格yhinlog,并进行有关设计,结果如图6-1-3所示:

图6-1-3  表格yhinlog的设计

  (2)选择用户名相应的文本框,切换到标签面板,展开“CSS/辅助功能”,在id中输入YHNAME;展开“未分类”,输入runat,server,把YHNAME文本框改为服务器控件,如图6-1-4所示:

图6-1-4  修改文本框标签

  (3)依此类推,密码相应的文本框命名为YHPASS,密码再确认相应的文本框命名为REPASS,QQ码相应的文本框命名为YHQQ,Email相应的文本框命名为YHEMAIL,主页相应的文本框命名为YHINDEX,将所有文本框改为服务器控件。

  (4)选择表单Yhinfrm,并将其改为服务器控件,保存yhinlog.aspx。

  6.1.3  完成注册页面的设计

  (1)由模板bkblog.dwt.aspx新建动态动态网页yhlogok.aspx,在mainbody可编辑区域中插入三行一列的表格logok,在第二行中输入文字“欢迎”,点击ASP.NET快捷菜单中的“绑定数据”,再点击“修剪的表单元素”,把光标移到如图6-1-5所示的位置,输入“YHNAME”。

图6-1-5  插入修剪的表单元素

  (2)返回设计视图,继续输入文字“Donking's BLOG!”,并、对表格logok,进行有关设计,结果如图6-1-6所示:

图6-1-6 表格logok的设计

  (3)选择按钮“主页”按钮,在【行为】面板中,添加行为转到URL,在弹出的对话框中,输入链接为“index.aspx”,保存yhlogok.aspx

6.2验证用户注册

  为了防止用户输入错误的注册信息,要对用户注册信息进行规范和验证。

  (1)打开yhinlog.aspx,打开ASP.NET快捷菜单,点击【更多标签】,如图6-2-1所示:

图6-2-1  ASP.NET 快捷菜单

  (2)在弹出的标签选择器中展开“ASP.NET 标签”→“验证服务器控件”,在右窗架中选中“asp:RequiredFieldvalidator”,单击“插入”按扭,如下图6-2-2所示:

图6-2-2  标签选择器

  (3)在弹出的标签编辑器中,为文本框YHNAME添加验证控件,填写各项如图6-2-3所示:

图6-2-3  RequiredFieldValidator标签编辑器

  (4)打开标签选择器,插入ASP.NET验证服务器控件→CompareValidator控件,为文本框YHPASS添加与REPASS文本框对比验证控件,填有关信息如图6-2-4所示:

图6-2-4  CompareValidato标签编辑器

  (5)插入ASP.NET验证服务器控件→Rangevalidator控件,为文本框YHQQ添加验证控件,填有关信息如图6-2-5所示:

图6-2-5  Range validator标签编辑器

  (6)插入ASP.NET验证服务器控件→Regularexpressionvalidator控件,为文本框YHEMAIL添加验证控件,填各项如图6-2-6所示,其中的验证表达式为:/w+([-+.]/w+)*@/w+([-.]/w+)*/./w+([-.]/w+)*

图6-2-6 Regular expression validator标签编辑器

  (7)插入ASP.NET验证服务器控件→Regularexpressionvalidator控件,为文本框YHINDEX添加验证控件,填写各项如图6-2-7所示,其中的验证表达式为:http://([/w-]+/.)+[/w-]+(/[/w- ./?%&amp;=]*)?

图6-2-7  Regular expression validator 标签编辑器

  (8)应该再一个验证控件防止用户注册的用户名重复。

  ①添加数据集yhinlog,设为筛选,筛选字段为YHNAME,参数变量为来之表单变量YHNAME,其设置如图6-2-8所示:

图6-2-8  插入数据集yhinlog

  ②插入ASP.NET验证服务器控件→CustomValidator控件,为文本框YHINDEX再添加验证控件,填写各项如图6-2-9所示,其中的客户端验证功能为:

<%# IIf(yhinlog.RecordCount>0,FALSE,TRUE) %>

图6-2-9  Custom Validator标签编辑器

  (9)保存yhinlog.aspx,在IE中进行浏览,如果出现图6-2-10所示的对话框,那说明的dklog站点根目录下没有子目录aspnet_client,也是就没有验证控件必要的JS脚本库。这个在安装.NET框架的时候,安装程序已经复制在默认站点c:/ Inetpub/wwwroot的根目录下,复制c:/ Inetpub/wwwroot中的子目录aspnet_client到dkblog站点根目录下,就OK了!

图6-2-10  找不到必要JS脚本库

6.3  添加“插入记录”服务器行为

  (1)打开yhinlog.aspx,添加【插入记录】服务器行为,表单的有关数据添加到数据表YH中,其有关设置如图6-3-1所示:

图6-3-1  添加【插入记录】服务器行为

  (2)ASP.NET是不支持gb2312编码传输。切换到代码视图,找到:

<%@ Page Language="VB" ContentType="text/html" ResponseEncoding="gb2312" %>

  把 ResponseEncoding="gb2312" 这句代码删掉就OK了:

<%@ Page Language="VB" ContentType="text/html"%>

  (3)保存,在IE中浏览提交用户注册信息,在Access打开YH表,可以发现提交的中文信息全变成了??。那怎么办?不用急,这是由于TASP.NET不支持gb2312编码传输所致。打开yhinlog.aspx,切换到代码视图,找到第一行代码:

<%@ Page Language="VB" ContentType="text/html" ResponseEncoding="gb2312" %>

  把它改为:

<%@ Page Language="VB" ContentType="text/html" %>

  也就是去除ResponseEncoding="gb2312"。其他网页也按此法进行修改,防止中文提交信息出错。

  

7.1  用户登录服务器行为

  用户登录,经过验证正确,页面换了个用户登录后的面貌。

  (1)打开模板bkblog.dwt.aspx,在左边栏插入表格yhtab,并设计如图7-1黑色圈中所示。

  (2)插入关于YH表查询的数据集yhlog,以验证用户登录的正确。

  ①将数据集yhlog设为筛选,如图7-2所示。

图7-1  表格yhtab的设计图   

 图7-2  插入数据集yhlog

  ②点击“高级”按钮,切换到高级数据集模式,如图7-3所示。

图7-3  插入数据集yhlog

  ③点击参数“+”,弹出“编辑参数”对话框,填写名称为“@Logpas”,类型选择“WChar”,如图7-4所示。

图7-4  添加参加Logpass

  ④点击“建立”按钮,弹出“生成值”对话框,名称为“Logpass”,源选择“表单变量”,如图7-5所示。

图7-5  生成值对话框

  ⑤单击“确定”保存设置,一直回到数据集yhlog对话框。修改SQL语句,修改结果如图7-6所示。

图7-6  对数据集yhlog进行修改

  (3)在<html>标签之前,插入如图7-7红色圈所示的代码

图7-7  定义函数uselog

  (4)拖拉模板bkblog.dwt.aspx中的数据集yhlog下的字段YHNAME到页面任何位置,再拖拉数据集yhlog下的字段YHID在其后,代码如下:

<%# yhlog.FieldValue("YHNAME", Container)  %><%# yhlog.FieldValue("YHID", Container)  %>

  把上面代码改为:

<%# uselog(yhlog.FieldValue("YHNAME", Container),yhlog.FieldValue("YHID", Container)) %>

  (5)插入关于ZT表查询的数据集bjre,返回该用户发表的学习笔记总数。

  ①将数据集设为“筛选”,筛选字段为:YHID,筛选方式为:输入值,如图7-8所示。

图7-8  插入数据集bjre

  ②点击“高级”,切换到高级数据集模式,将SQL修改成如图7-9所示。

图7-9  修改数据集bjre

  ③点击“编辑”按钮,在文本域中把YHID改为session(”USEID”),结果如图7-10所示。

图7-10  编辑数据集bire的参数

  ④按“确定”键,再按“确定”键完成数据集bire。

  (6)插入关于HF表查询的数据集plre,返回该用户发表的学习笔记总数。除了查询表不同外,其他设置与数据集bjre相同(可以先复制粘贴数据集plre,再进行修改)。

  (7)拖拉数据集bjre下的字段Eprl100到表格yhtab中的“发表笔记:”之后;拖拉数据集plre下的字段Eprl100到表格yhtab中的“发表回复:”之后。

  (8)把光标移到表格yhtab中的“用户信息”之前,点击ASP.NET快捷菜单下的“绑定数据”,结果如图7-11所示。

图7-11  插入绑定数据

  保持光标在图71红色垂直线的位置,输入:session(“USENAME”)

  (9)返回设计视图,给表格yhtab中的“发表新笔记”建立超级链接:../ztfb.aspx

  给表格yhtab中的“修改资料”建立超级链接:../yhsg.aspx

  结果如图7-12所示。

图7-12  表格yhtab的修改

  (10)选择表格yhtab,返回代码视图,按“Ctrl+X”或在【编辑】菜单中选择“剪切”,老方法:把它粘贴到新建立的记事本或Word文档中。

  (11)返回设计视图,选择表格logtab,把光标移至如图7-13所示的红色垂直线的位置。

图7-13  移至光标所在位置

  (12)输入代码,如图7-14红色圈中所示。

图7-14  在标签<form>之前插入代码

  (13)把光标移到Yhlogfrm结束标签</form>之后,输入代码,如图7-15红色圈中所示。

图7-15  标签</form>之后插入代码

  (14)把第7步中剪切的表格yhtab粘贴在代码<%end  if%>代码之前,<% else %>之后。

  (15)保存模板bkblog.dwt.aspx。打开所有基本于bkblog.dwt.aspx模板建立的网页,分别在【服务器行为】中把bkblog.dwt.aspx模板中新添加的数据集yhlog、bjre、plre,复制、粘贴过来。再插入如第3步骤的代码,就OK了!

  (16)在IE浏览器中浏览index.aspx,用户登录前如图7-16所示,用户登录成功如图7-17所示。记得ASP.NET是不支持gb2312编码传输,要进行修改,上一章中已说过了,以后不再哆嗦。

图7-16  用户登录前

图7-17  用户登录后

  提醒:为了方便读者学习,教程分成模块来写。实际上一开始就得在模板中所有功能做好,特别是在模板必须插入的数据集及页头载入程序,因为这些在后期修改后不能更新网页。

7.2  用户发表回复信息

  用户登录后,就可以对 各学习笔记发表回复信息。

  (1)打开hf.aspx,插入表单yhplfrm,再插入表格Hftab,在表格中插入服务器文本框控件,ID为HFNAME;插入服务器文本区域控件,ID为HFTEXT;插入“发表”按钮,ID为plbottom,将其设为禁用,结果如图7-18所示。

图7-18  表格Hftab的有关设计

  (3)绑定数据session(“usename”)到表格Hftab中的“姓名:”之后(方法如7.1第8步骤绑定“用户信息”前的用户名)。

  (4)拖拉数据集Ztre下的字段ZTNAME到文本框HFNAME,在文本框HFNAME的属性窗口中,把初始值:

<%# Ztre.FieldValue("ZTNAME", Container) %>

  改为:

<%#  “RE:”&Ztre.FieldValue("ZTNAME", Container) %>

  (5)选择按钮plbottom,右键选择状态栏< input # plbottom>,在弹出快捷菜单中选择“编辑标签”,如图7-19所示。

图7-19  选择< input # plbottom>快捷编辑标签

  (6)在弹出的< input # plbottom>快捷编辑标签中把:

disabled=”true”

  改为:

disabled=<%# iif((session("USENAME")<>nothing),false,true) %>

  结果如图7-20所示。

图7-20  快捷< input # plbottom>编辑标签

  即设按钮plbottom,当用户登录前为禁用,用户登录后为可用。

  (4)添加插入记录服务器行为,提交值来自表单yhplfrm,选择插入表格为HF,其他设置如图7-21所示。

图7-21  添加插入记录服务器行为

  在图7-21中,可以看到字段HFID、HFTIME、YHID、ZTID没有获取值。字段HFID是自动编号,数据库会自动给记录添加数值;字段HFTIME在Access中已设默认值为date(),所以数据库会自动给新增加的记录添加当天日期。那字段YHID就是登录用户的ID码,字段ZTID就是要发表的笔记ID。所以要把登录用户的ID码添加到字段YHID中,要发表的笔记ID码添加到字段ZTID中。

  (5)返回到代码视图,找到插入记录(dkconn,HF)的代码,如图7-22黑色已选择部分。

图7-22  找到插入记录(dkconn,HF)的代码

  (6)把代码:

CommandText='<%# "INSERT INTO HF (HFNAME, HFTEXT) VALUES (?, ?,)" %>'

  改为:

CommandText='<%# "INSERT INTO HF (HFNAME, HFTEXT, ZTID, YHID) VALUES (?, ?, ?, ?)" %>'

  (7)按次序添加参数:

<Parameter  Name="@ZTID"  Value='<%# Ztre.FieldValue("ZTID", Container)  %>'  Type="Integer"   />

       <Parameter  Name="@YHID"  Value='<%# SESSION("USEID")  %>'  Type="Integer"   />

  结果如图7-23所示。

图7-23  插入记录(dkconn,HF)代码的修改结果

  (8)在发布回复信息前,得对回复标题和回复的内容进行验证,防止发布空标题或空内容的回复信息。参照6.2节中插入RequiredFieldValidato验证控件方法,分别给文本框HFNAME、文本区域控件HFTEXT添加RequiredFieldValidato验证控件。

  (9)用户发布回复信息时,还得给学习笔记的回复总数自动增加1,也就是给ZT表下的HFZS字段自动增加1。

  ①在【服务器行为】面板中,插入“更新记录”服务器行为,设更新表格为ZT,暂时设提交值,来自表单yhplfrm,暂时设:‘HFZS’从‘HFTEXT’获取值(作为‘Integer’);暂时设:‘ZTID’将‘HFTEXT’ 用作‘Integer’来选择记录

  ②为什么全是暂时的?那是为了先让Dreamweaver自动生成一些代码,后方便修改。先切换代码视图,找到更新记录(dkconn,ZT)的原代码,找到其中的代码:

<Parameter Name="@HFZS" Value='<%# IIf((Request.Form("HFTEXT") <> Nothing), Request.Form("HFTEXT"), "") %>' Type="Integer" /> 

<Parameter Name="@ZTID" Value='<%# IIf((Request.Form("HFTEXT") <> Nothing), Request.Form("HFTEXT"), "") %>' Type="Integer" /> 

  把它改为:

<Parameter Name="@HFZS" Value='<%# Ztre.FieldValue("HFZS", Container)+1 %>' Type="Integer" />

<Parameter Name="@ZTID" Value='<%#  session("ztanw") %>' Type="Integer" />

  (10)保存hf.aspx。

7.3  用户发表学习笔记

  用户登录后,除了可以发表回复信息外,还可以发表新的学习笔记。

  (1)新建由模板bkblog.dwt.aspx生成动态网页ztfb.aspx,在mainbody可编辑区域中插入一列五行的表格ztfb。

  (2)添加数据集zthb,设筛选为YHID,并设参数为阶段变量USENAME,其设计如图7-24所示。

图7-24  添加数据集zthb

  (3)拖拉数据集下的有关字段到表格ztfb中,方法参照第4.2节的方法。

  (4)打开hf.aspx,复制表单yhplfrm,把它粘贴到网页ztfb.aspx中的表格zthb的第五行,清空文本框HFNAME,并进行必要的修改,结果如图7-25所示。

图7-25  表格ztfb的设计

  (2)把文本框HFNAME改名为ZTNAME,文本区域HFTEXT改名为ZTTEXT。

  (3)设表格zthb的第一、二、三行为数据集zthb的重复区域,再在表格的第四行中插入数据集导航。

  (4)插入列表/菜单LMID,点击其属性窗口中的列表值,在弹出的列表值对话框中,输入项目标签为:设计项;值为:1,按“确定”键,如图7-26所示。

图7-26  LMID列表值对话框

  (5)保持列表/菜单LMIDl在选,切换到代码视图,找到列表/菜单LMID的原代码,拖拉数据集menuda下的字段LMID,替换value等于号的数据1,如图7-27所示。

图7-27  拖拉数据集menuda下的字段LMID

  (6)拖拉数据集menuda下的字段LM,替换“设计项”,结果如图7-28所示。

图7-28  拖拉数据集menuda下的字段LM

  (7)选择图7-3-5红色圈中的代码,并把它定义为数据集menuda的重复区域,结果如图7-29所示。

图7-29  定义列表中的数据集menuda重复区域

  (8)添加“插入记录”服务器行为,其设置如图7-30所示。

图7-30  添加“插入记录”服务器行为

  (9)切换到代码视图,找到插入记录(dkconn,ZT)的原代码,找到代码:

CommandText='<%# "INSERT INTO ZT (LMID, ZTNAME, ZYTEXT) VALUES (?, ?, ?)" %>'

  改为:

CommandText='<%# "INSERT INTO ZT (LMID, ZTNAME, ZYTEXT,YHID) VALUES (?, ?, ?, ?)" %>'

  (10)添加参数:

<Parameter Name="@YHID" Value='<%# session("USEID") %>' Type="Integer" />

  结果如图7-31所示。

图7-31  插入记录(dkconn,ZT)修改的原代码

7.4  修改用户资料

  修改用户资料页面设计与用户注册页面设计基本相同。

  (1)打开注册页面yhlogok.aspx,把它另存为yhsg.aspx,并进行适当的修改,结果如图7-32所示。

图7-32  yhsg.aspx页面设计

  (2)删除“插入记录(dkconn,YH)”服务器行为,添加数据集yhsg,如图7-33所示。

图7-33  插入数据集yhsg

  (3)绑定数据集yhsg下的有关字段到相应的文本框中,结果如图7-34所示。

图7-34  绑定动态文本到有关文本框中

  (4)添加更新记录服务器行为,暂时设:’YHID’将’YHNAME’用作’Integer’来选择记录,结果如图7-35所示。

图7-35  添加更记录服务器行为

  (5)在更记录的原代码中,找到代码:

<Parameter Name="@YHID" Value='<%# IIf((Request.Form("YHNAME") <> Nothing), Request.Form("YHNAME"), "") %>' Type="Integer" /> 

  将其改为:

<Parameter Name="@YHID" Value='<%# IIf((Not Session("USEID") Is Nothing), Session("USEID"), "") %>' Type="Integer" /> 

  (6)保存yhsg.aspx。

8.1  管理员登录的实现

  (1)新建空白的APS.NET VB动态页gllogin.aspx,插入表单glfrm,再插入表格,设置如图8-1所示。

图8-1  gllogin的页面设计

  (2)设管理员相应的文本框的ID为GLY,密码对应的文本框的ID为GLPASS。

  (3)添加数据集gly,设为筛选,如图8-2所示。

图8-2  添加数据集gly

  (4)点击“高级”按钮,添加参数@GLPASS,如图8-3所示。

图8-3  添加参数@GLPASS

  (5)在数据集gly高级对话框中,将SQL命令改为如图8-4所示。

图8-4  数据集gly高级对话框

  (6)切换到代码视图,在<html>标签之前,插入如图8-5所示的代码。

图8-5  在<html>标签之前插入代码

  (7)保存gllogin.aspx。

8.2  学习笔记管理

  从上节中,可以看到管理员登录成功后,链接到Doking’s BLOG的首页,对学习笔记进行管理。但以前章节中,index.aspx没有删除学习笔记的功能。这一节将为它添加这一功能。

  (1)在表格ztre的第一行中,插入asp标签Label1,文本为:删除,如图8-6所示。

图8-6  插入asp标签Label1

  (2)右键选择asp标签Label1,选择快捷菜单下的“编辑标签”,选择“样式信息”,设为不可见,如图8-7所示。

图8-7  设asp标签Label1为不可见

  (3)插入表单控件下的复选框,命名为ZTID,插入表单控件下的按钮,ID为GLY,结果如图8-8所示。

图8-8  在表格ztre的设置

  (4)切换到【标签】面板下的【属性】选项卡,展开“常规”项,在“value”项中单击动态数据,如图8-9所示。

图8-9  ZTID标签属性面板

  (5)在弹出的“动态数据”对话框中,选择数据集Ztre下的字段ZTID,按“确定”键,如图8-10所示。

图8-10  动态数据窗口

  (6)在状态栏下右键选择<input#ZIID>打开快速编辑标签窗口,在其标签中添加代码:

style="visibility: <%# iif(session("GLY")<>nothing,"visible","hidden")%>" value="<%# Ztre.FieldValue("ZTID", Container) %>"

  如图8-11深蓝色所示。

图8-11  快速编辑<input#ZIID>标签

  (7)选择按钮GLY,在状态栏下右键选择<input#GLY>打开快速编辑标签窗口,在其标签中添加代码:

style="visibility: <%# iif(session("GLY")<>nothing,"visible","hidden")%>" value="<%# Ztre.FieldValue("ZTID", Container) %>"

  (8)添加“删除记录”服务器行为,其设置如图8-12所示。

图8-12  添加“删除记录”服务器行为

  (9)按“确定”键,完成添加“删除记录”服务器行为。切换到代码视图找到该“删除记录”服务器行为的原代码,如图8-13红色圈中所示。

图8-13  “删除记录”服务器行为的原代码

  (10)删除如图8-2-8中所示的5、8、12、13、14行的代码,将第10行中Debug的值true改为false,添加新行为:id=“del1”,修改后如图8-14红色圈中所示。

图8-14  修改后“删除记录”del1服务器行为的原代码

  (11)复制图8-2-9红色圈中所示的代码,即复制修改后“删除记录”del1服务器行为的原代码,把它粘贴到适当位置,改id为”del2”,如图8-15所示。

图8-15  添加del2“删除记录”服务器行为

  (12)在页面载入触发的事件page_load中插入如图8-16红色圈中所示的代码。

图8-16  在页面载入触发的事件page_load中插入的代码

8.3  笔记回复管理

  笔记回复管理与学习笔记管理的道理和方法是一致的。

  (1)打开index.aspx,复制asp标签Label1、表单控件ZTID和按钮GLG,打开hf.aspx,把这三个控件粘贴到如图8-17所示的位置,把表单控件ZTID的ID改为HFID。

图8-17  给hf.aspx粘贴控件

  (2)选择复选框HFID,切换到【标签】面板下的【属性】选项卡,展开“常规”项,在“value”项中单击动态数据,在弹出的“动态数据”对话框中,选择数据集Hfre下的字段HFID,按“确定”键,如图8-18所示。

图8-18  动态数据窗口

  (3)复制index.aspx 中的“del1”删除记录服务行为的原代码,粘贴到hf.aspx中。

  (4)给hf.aspx页面中的页面载入触发事件page_load插入如图8-19红色圈中所示的代码。

图8-19  给h页面载入触发事件page_load插入代码

  (5)找到表单yhplfrm的原代码,将其移到表格ztre标签之前,结果如图8-20所示。

图8-20  移动表单yhplfrm的标签

  (6)在表格Hftab标签之前插入如图8-21红色圈所示的代码。

图8-21  在表格Hftab标签之前插代码

  (7)将表单yhplfrm结束标签</form>移到表格ztre标签之后,在表格Hftab标签之后插入如图8-22红色圈所示的代码。

图8-22  在表格Hftab标签之后插代码

  提醒:这里还有一个管理员退出登录的问题,那就留给读者动动脑筋。提示一下,只要设session(“GLY”)为空值或空字串就可以了。

9.1  基本页面设计

  打开模板dkblog.dwt.aspx,在左边导航上添加文字设计如图9-1所示。

图9-1  模板dkblog.dwt.aspx左边导航文字设计

9.2  在线人数统计

  在线人数统计的实现得依靠global.asax文件。global.asax文件包括了处理应用程序层次事件的程序代码,就像在经典ASP中的Global.asa文件。在Global.asax中的<script>标签包含了面对应用程序层次的事件处理器。第一组的事件处理器负责处理应用程序的开始以及停止事件。一个开始事件会在任何页面第一次被请求的时候被唤醒。而应用程序终止事件则会在应用程序关闭的时候被唤醒。
建立global.asax文件,一般得手编。现在可以Visual Web Developer 2005这个软件中快速建立global.asax文件。

  (1)下载、安装Visual Web Developer 2005。

  Visual Web Developer 2005 下载地址:

http://go.microsoft.com/fwlink/?linkid=30092&clcid=0x409

  下载后安装,运行后其欢迎界面如图9-2所示。

图9-2  Visual Web Developer 2005运行欢迎界面

  (2)在Visual Web Developer 2005运行后,选择【File】→【New File】,在弹出【New File】对话框中,展开“Categories”的“Web”选项,并选择“Visual Basic”,选择“Templates”中的“Global Application Class”,如图9-3所示。

图9-3  新建立Global Application Class

  (3)单击“Open”按钮,新建交一个新的Glbal文件如图9-4所示。

图9-4  一个新建立的Glbal文件

  (4)对Glbal文件进行修改,修改后如图9-5所示。

图9-5  修改Glbal文件

  (5)保存Glbal文件到D:/dkkblog根目录下,文件名为Glbal.asax。

  (6)返回到Dreamweaver中,打开模板dkblog.dwt.aspx,并切换成代码视图,找到代码:

<td class="BTD">本站在线人数统计:人</td>

  并改为:

<td class="BTD">本站在线人数统计:<%=Application("dk_uses")%> 人 </td>

  (7)保存模板。

  提醒:这里用Visual Web Developer 2005建立Glball.asax文件,只为了方便读者,同时也让读者接触一下Visual Web Developer 2005,这个新软件功能十分强大。如果没有Visual Web Developer 2005,大可直接新建一个空白记事本,编写如上图9-5所示的代码,保存成Glball.asax文件就好了。

9.3  站点笔记和回复的统计

  回想在“7.1  用户登录服务器行为”中,曾为用户统计其发表笔记与回复,站点笔记和回复的统计与其类同。

  (1)打开模板dkblog.dwt.aspx,新建数据集zdbj,其设置如图9-6所示;新建立数据集zdhf,其设置如图9-7所示。

图9-6  数据集zdbj的设置图

图9-7  数据集zdhf的设置图

  (2)分别绑定数据集zbbj、数据集zbhf到页面中,如图9-8所示。

图9-8  绑定数据集zbbj、zbhf

  (3)保存模板dkblog.dwt.aspx,更新所有网页。

既然Doking’s BLOG是学习笔记,那么按日历可以查出所有笔记和笔记回复。

  难点分析:是不是要在模板中直接添加Calendar日历控件?不!那是不行的!由于Calendar日历控件是服务器控件,要在含有runat="server"表单该服务器控件,但一页面中只能有一个含有runat="server"表单,不然有时会出现如图10-1所示的错误显示。

图10-1  页面只能有一个含有runat="server"表单的错误

  那怎么办?这里是采取嵌入式框架进行转移。

10.1  添加Calendar日历控件

  (1)新建一个空白ASP.NET VB动态页。

  (2)插入带出runat="server"表单,设置ID=”Calfrm”。

  (3)点击ASP.NET快捷菜单下的“更多标签按钮,在弹出【标签选择器】对话框中选择“ASP.NET 标签”下的“asp Calendar”,如图10-2所示。

图10-2  插入“asp Calendar”标签

  (4)按“插入”按钮,弹出【标签编辑器—Calendar】对话框,如图10-3所示。在这个对话中,可以对Calendar日历控件的样式进行设置,由于有中文,在这里就不多讲了。

  (5)保存ASP.NET VB动态页为dkCalendar.aspx。在IE中浏览,如图10-4所示。

图10-3  【标签编辑器—Calendar】对话框

            图10-4  dkCalendar.aspx在IE中的浏览

  在图10-1-4中,可以看到星期的显示太长了,很难看!如果显示为“日、一、二、三、四、五、六”,那就好了。

10.2  修改Calendar的星期显示

  (1)在Dreamweaver中打开dkCalendar.aspx,切换到代码视图,寻找如下代码:

<%@ Page Language="VB" ContentType="text/html" ResponseEncoding="gb2312" %>

  把它改为:

<%@ Page Language="VB" Debug="true" Culture="zh-CN"%>

  (2)点击ASP.NET快捷菜单下的“а:xy”按钮,插入命名空间,如图10-5所示。

  (3)此时新添代码:

<%@ Import Namespace="" %>

  输入命名空间为System.Globalization,即代码改为:

<%@ Import Namespace="System.Globalization" %>

  (4)再添加命名空间System.Threading,结果如图10-6所示。

图10-5  插入命名空间

图10-6  插入命名空间后代码

  (5)在代码:

<%@ Import Namespace="System.Treading" %>

  之后,空一行,并插入如下代码:

<script runat="server">

  Dim dkday‘定义选择日期所产生的链接字符串的全局变量

'改变星期显示的函数

Private Sub Calendar1_PreRender(ByVal sender As Object, ByVal e As System.EventArgs) Handles Calendar1.PreRender

Dim dkwek = System.Threading.Thread.CurrentThread

Dim dknew = System.Globalization.CultureInfo.CurrentCulture.Clone()

dknew.DateTimeFormat.DayNames = New String() {"日", "一", "二", "三", "四", "五", "六"}

dknew.DateTimeFormat.FirstDayOfWeek = DayOfWeek.Sunday

dkwek.CurrentCulture = dknew

End Sub

</script>

  (6)选择日历控件Calendar1的原代码,切换到【标签】面板的【属性】选项卡,展开“外观”选项,选择“DayNameFormat”项的下拉菜单,并选择“Full”,如图10-7所示。

  (7)保存dkCalendar.aspx,在IE中进行浏览,结果如图10-8所示。 

  

图10-7  选择“DayNameFormat”值为“Full”         图10-8  dkCalendar.aspx修改后在IE浏览

10.3  添加日历事件

  (1)在Dreamweaver中打开dkCalendar.aspx,切换到代码视图,选择Calendar1的原代码,右键单击它,在弹出的快捷菜单中选择“编辑标签(E)<asp:calendar>”,如图10-9所示。

图10-9  选择“编辑标签(E)<asp:calendar>”

  (2)在弹出【编辑标签—calendar】的对话框中,展开“事件”项,选择“OnSelectionChanged”,在“Calendar —OnSelectionChanged”事件文本区域中,输入“Calendar1_SelectionChanged”,按“确定”按钮,如图10-10所示。

图10-10  编辑OnSelectionChanged事件

  (3)在代码<script runat="server">标签中添加如图10-11红色圈所示的代码。

图10-11  添加Calendar1_SelectionChanged事件

  (4)在标签<head></head>之间,插入如图10-12红色圈所示的代码。

  (5)找标签<body>,将其改为如图10-13红色圈所示的代码。

图10-12  插入javascript函数dkwk

图10-13  修改标签<body>

  (6)再次把Calendar1的“DayNameFormat”项的设为“Full”,参照10.2节中的第6步骤。

  (7)保存dkCalendar.aspx,打开index.aspx,在page_load函数中添加如下代码:

if Request.QueryString("dkday")<>nothing then

Ztre.CommandText="SELECT * FROM ZTRE WHERE cstr(ZITIME) LIKE '%" &Request.QueryString("dkday")&"%' ORDER BY ZITIME DESC"

else

if (request.QueryString("menanw")<>nothing) or (session("menanw")<>nothing) then

Ztre.CommandText="SELECT * FROM ZTRE WHERE LMID = ? ORDER BY ZITIME DESC"

else

Ztre.CommandText="SELECT * FROM ZTRE  ORDER BY ZITIME DESC"

end if

end if

  结果如图10-14所示。

图10-14  在page_load函数中添加代码

  (8)找到记录集Ztre的原代码,删除其CommanText所在的命令行,结果如图10-15红色圈所示。

图10-15  修改后记录集Ztre的原代码

  (9)保存index.aspx。

10.4  添加嵌入式框架

  (1)打开模板dkblog.dwt.aspx,在ASP.NET快捷菜单中,点击“更多标签”快捷按钮,在弹出【标签选择器】对话框中,选择“HTML标签”,并选择“iframe”项,如图10-16所示。

图10-16  插入iframe标签(即嵌入式框架)

  (2)单击“插入”按钮,在弹出【标签编辑器—iframe】对话框中对要插入的嵌入式框架进行有关设置如图10-17所示。

图10-17  对嵌入式框架进行有关设置

  (3)按“确定”按钮,返回到【标签编辑器—iframe】对话框,再按“关闭”按钮。

  (4)保存模板dkblog.dwt.aspx,更新所有网页。

  (5)在IE中浏览index.aspx,结果如图10-18所示。

图10-18  在IE中浏览index.aspx

  提醒:其实日历事件的实现是十分复杂的事件,这里只是给出一个简单的例子。这一节还有一个难点就是嵌入式框架对主窗口对象的控制,这里中只是举了个用“parent.location.href”控制主窗口网页的流转。这些就留给读者们慢慢研究了。

经常看到许多网站有一个站内搜索功能,这个是如何实现呢?如果是ASP,那Dreamweaver很快就能实现。现在是ASP.NET,得稍微手编一下。

11.1  SELECT高级搜索技巧

  经过上面章节的学习,对SELECT多少会点了解。SELECT高级搜索技巧,其实也没有什么神秘,主要与模式匹配运算符的运用有关。所以这里主要讲解模式匹配运算符的运用。

  模式匹配运算符LIKE、NOT LIKE常用于模糊查找,它判断列值是否与指定的字符串格式相匹配。LIKE用于查找匹配一定条件的记录,NOT LIKE用于查找不匹配指定条件的记录。可用于字符串、文本、日期等类型查询。

  1.百分号%:可匹配任意类型和长度的字符。

  例如:SELECT 学习笔记 FROM 学习笔记表 WHERE 标题 LIKE “网络%”

  这个查询是要查询学习笔记表中标题以“网络”开始的所有学习笔记,如:网络数据库ASP一点通过、网络与手机通讯开发研究等。

  例如:SELECT 学习笔记 FROM 学习笔记表 WHERE 标题 LIKE “%ASP.NET%”
  这个查询是要查询所有标题包含了“ASP.NET”的学习笔记。

  2.下划线_:匹配单个任意字符,常用来限制表达式的字符长度。

  例如:SELECT 学习笔记 FROM 学习笔记表 WHERE 标题 LIKE ”V_开发精选 ”
  这个查询主要是查询类似于“VB开发精选”、“VC开发精选”这样标题的学习笔记。

  3.中括号[ ]:指定个字符、字符串或范围,要求所匹配对象为它们的任一个。

11.2  站内搜索功能的实现

  介绍了SELECT高级搜索技巧后,将要介绍站内搜索功能的实现。这里只采用了百分号%模式匹配运算符。

  (1)打开模板dkblog.dwt.aspx,插入表单,设ID=” gofrm”,动作为” ../dkgo.aspx”,方法为”POST”;插入文本框,设ID= “dkgotxt”;插入按钮“搜索”,结果如图11-1所示。
  (2)保存模板dkblog.dwt.aspx更新所有网页。
  (3)新建一个空白ASP.NET VB动态页,并保存为dkgo.aspx。添加数据集Ztre,其设置如图11-2所示。

图11-1  添加有关表单控件

图11-2  添加数据集Ztre

  (4)单击“高级”按钮,把SQL命令:

SELECT * FROM ZT ORDER BY ZITIME DESC

  改为:

SELECT * FROM ZT WHERE ZTNAME LIKE '%"+Request.Form("dkgotxt")+"%' ORDER BY ZITIME DESC

  结果如图11-3所示。

图11-3 对数据集Ztre进行修改

  (5)对dkgo.aspx页面进行有关设计,绑定有关动态文本到页面中,设计重要区域,结果如图11-4所示。

图11-3  对dkgo.aspx的页面设置

  有关设置细节可以参照index.aspx的有关设置。

把Doking's BLOG上传到远程空间

  为了使Doking's BLOG程序上传到远程空间后能正常的运行,下面介绍几个安装要点。

  1.本教程提供的Doking's BLOG程序是以站点根目录为主,由于要用到web.config配置文件、bin目录以及aspnet_client脚本库,这三个文件和目录必须放在站点的根目录下才能数据集、窗体验证程序正常运行。

  2.本教程的源程序文件和web.config配置文件、bin目录以及aspnet_client脚本库都放在同一目录中,这三个文件位置是不能动的,如果想把Doking's BLOG页面放在根目录下的二级目录中,比如这样:

http://localhost/dkblog/

  上面地址中,dkblog目录是放置Doking's BLOG页面文件的,除了web.config配置文件、bin目录以及aspnet_client脚本库上传到根目录中外,其它所有文件都可以复制到dkblog目录中。

  3.由于Dreamweaver MX把连接数据库的字符串存放在web.config配置文件中,打开web.config配置文件,可以看到如图12-1红色圈所示是数据库在本地的物理路径。

图12-1  web.config配置文件部分内容

  由于上传到远程空间,其物理路径一般不会本地的物理路径相同。在web.config配置文件中也不能使用诸如Server.MapPath之类的服务器变量来获取远程空间的数据库物理路径。

  可以通过以下方法来获取数据库在远程主机的真实目录物理路径。假定,在上传远程空间的域名地址如下:

http://www.pconline.com.cn/dkblog

  通过上面的虚拟地址访问远程虚拟主机的二级目录dkblog,数据库文件保存在dat文件夹中,因此实际虚拟地址为:http://www.pconline.com.cn/dkblog/dat

  在Dreamweaver中新建一个空白的ASP.NET VB动态页,切换到代码视图,输入如下代码:

<%=server.MapPath("") %>

  保存为dkurl.aspx,在IE浏览,结果如图12-2所示。

图12-2  测试物理路径

  可以看到dkurl.aspx所在的物理路径就是:D/dkblog/,那数据库的物理路径自然是:D:/dkblog/dat/dkblog.mdb。

  得到远程主机的物理路径后,打开web.config配置文件,修改数据库的物理路径。

  提醒:到此Doking’s BLOG的程序开发已完成。该程序十分简单,但有利于初学者开发数据库。实际应用的BLOG程序其实十分复杂,许多技巧有待读者去深思和研究。

 

 

android应用开发全程实录-你有多熟悉listview?

今天给大家带来《android应用开发全程实录》中关于listview和adatper中的部分。包括listview的基本使用,listview的优化等。 我们经常会在应用程序中使用列表的形式来...
  • Double2hao
  • Double2hao
  • 2015年09月27日 22:11
  • 919

php => PHP项目开发案例全程实录

1. 2. 3. 4. 5.
  • qq_16644789
  • qq_16644789
  • 2015年12月13日 13:37
  • 3538

Visual c++ 项目开发案例 全程实录 源代码

[01.rar] 《visual c++项目开发案例全程实录》(第二版)第一章 社区视频监控系统 配套源代码 (2012-05-21, Visual C++, 10140KB, 9次) [1...
  • diaoguangqiang
  • diaoguangqiang
  • 2013年11月01日 20:10
  • 4212

移动支付平台间接口报文解析技术及平台交易处理项目

《基于移动支付平台间接口报文解析技术核心架构实现、及平台交易处理项目全程实录》 课程讲师:MoMo  课程分类:Java框架 适合人群:中级 课时数量:52课时 用到技术:JavaBean ...
  • oppooppp
  • oppooppp
  • 2014年07月18日 09:16
  • 964

android应用开发全程实录

今天给大家带来《android应用开发全程实录》中关于listview和adatper中的部分。包括listview的基本使用,listview的优化等。 我们经常会在应用程序中使用列表的形式来展现...
  • dyllove98
  • dyllove98
  • 2013年04月20日 13:56
  • 685

Dreamweaver CC 2017 正式版昨天已经发布了!看看截图

启动界面 开启后第一屏 用Dreamweaver 很多年,Dreamweaver cs6 到 Dreamweaver cc 2017 的变化实在是太大,简直是颠覆性...
  • qq996150938
  • qq996150938
  • 2016年11月03日 23:15
  • 7909

WPF企业内训全程实录(下)

摘要   WPF企业内训全程实录由于文章比较长,所以一共拆分成了三篇,上篇WPF企业内训全程实录(上)主要讲了基础,中篇WPF企业内训全程实录(中)主要讲解开发模式、团队协作及应用框架,起着承上启下的...
  • u011387207
  • u011387207
  • 2013年07月15日 16:44
  • 1434

WPF企业内训全程实录(上)

一. 摘要   圣殿骑士由于工作和项目需要,所以对一些技术进行了较为深入的研究,之前在整个公司做过一些技术专场的培训,由于每次时间较短且人员较多的关系,没能讲得很透彻。一直都想以文字的形式把这些培训细...
  • u011387207
  • u011387207
  • 2013年07月15日 16:44
  • 1870

在安装sublime之后,我为何毫不犹豫卸载了Dreamweaver?

在安装sublime之后,我为何毫不犹豫卸载了Dreamweaver? 时间:2016-3-23(周三下午) 缘由:打算换一款编辑器 故事背景:一名大二在校生接触网站前端之路一个月的坎坷历程。 ...
  • sinat_34394240
  • sinat_34394240
  • 2016年03月23日 17:34
  • 2218

使用PHP在Dreamweaver下链接mysql数据库

最近遇到很多赶交期末作业的大学生求助,问Dreamweaver6.0 怎么连接数据库啊二哥,本着让你渡过大学美好时光的最后时光, 二哥这个忙帮定了。...
  • liunianerge
  • liunianerge
  • 2017年06月24日 12:19
  • 1548
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:Dreamweaver构建Blog全程实录
举报原因:
原因补充:

(最多只允许输入30个字)