dreamweaver在线论坛制作.docx

dreamweaver在线论坛制作.docx

《dreamweaver在线论坛制作.docx》由会员分享，可在线阅读，更多相关《dreamweaver在线论坛制作.docx（28页珍藏版）》请在冰豆网上搜索。

dreamweaver在线论坛制作

第10章论坛

内容导读

本章讲解论坛（BBS）的制作。

本论坛的功能比较简单，没有设置用户的注册、登录，因为各种注册和登录的制作基本相同，在其他章节已经有所介绍，本章就省略了此功能。

本论坛实现了管理员登录和管理员账号的管理、帖子的管理、发表主题、浏览主题、回复主题、按主题进行搜索功能。

本章详细讲解了论坛的系统分析和总体设计，各个模块的制作方法，使用Dreamweaver作为开发工具，采用ASP和Access技术来实现。

重点提示

BBS系统的模块设计

Dreamweaver中数据库表和字段的灵活使用

帖子主题的发表、回复与管理

10.1系统分析与总体设计

论坛出现的时间较早，一般是作为大型网站的一个模块存在，发展至今，论坛的功能越来越丰富，出现了很多大型的论坛网站。

本章介绍的论坛是典型的论坛，包括常见的功能，例如发表并显示帖子、回复并显示回复信息，管理模块包括注册和登录模块，帖子管理模块。

在使用Dreamweaver进行论坛模块的设计之前，我们的首要工作是对论坛做系统的规划，规划的工作包括论坛功能模块的确定、各网页的布局、数据库的设计。

10.1.1功能介绍

本章是要实现一个典型的论坛的基本功能，实际上更接近于前者。

它在规模上比较小，但是具有论坛的基本功能。

论坛系统的基本功能包括注册与登录模块、帖子的发表与显示、论坛的管理模块，本章省略了用户的注册与登录。

（1）发表帖子

（2）显示帖子

（3）论坛管理

10.1.2总体布局

本章论坛系统的总体布局如图10.1所示。

10.1.3数据库结构及实现

（1）创建数据库

启动Access，新建空数据库文件，命名为forum.mdb。

（2）passadmin数据表

创建一个新表，命名为passadmin，该数据表存储系统管理员信息，包括管理员的登录名和密码。

其设计视图如图10.2所示。

（3）postMain数据表

创建新表，命名为postMain，它的设计视图如图10.3所示。

（4）postRe数据表

创建新表，命名为postRe，其设计视图如图10.4所示。

10.2模块设计

根据上一节的规划，我们采用Dreamweaver作为开发工具，使用ASP，结合Access技术实现所有的功能模块。

本节将详细讲解各模块的设计制作过程，读者跟随操练就能够很容易实现。

10.2.1首页（index.asp）设计

本论坛的首页为index.asp，它的浏览效果如图10.5所示。

下面详细讲解本页面的制作过程。

（1）该站点需要使用到数据库forum中的表postMain，在Dreamweaver的【应用程序】面板下的【数据库】选项卡中，单击加号（+），选择【数据源名称（DSN）】命令，如图10.6所示。

（2）在Dreamweaver中，使用表格和预先设计好的图片等素材，设计主页的框架和显示效果，如图10.12所示。

（3）绑定记录集。

单击“插入”工具栏中的“数据”选项卡，选择记录集按钮，设置记录集Recordset1的相关选项，如图10.13所示。

（4）绑定数据。

将记录集Recordset1中的main_important字段绑定到标签，代码为：

>

设计情况如图10.14的A区所示。

（5）设置重复区域。

（6）如果论坛中还没有发表的帖子，应该显示没有帖子的提示信息，此时记录集Recordset1中没有记录。

选中“暂时没有帖子！

”文本，在“插入”工具栏中选择“数据”选项卡，选择“如果记录集为空则显示”命令，在弹出的对话框中选择【记录集】为Recordset1，如图10.17所示。

（7）添加导航条。

将鼠标放置在重复区域的右下方的表格中，在“插入”工具栏中选择“数据”选项卡，单击“记录集导航条”工具按钮，在弹出的【记录集导航条】对话框中选择记录集“Recordset1”，设置【显示方式】为“文本”，如图10.18所示。

（8）添加超链接。

在主页上的图片“发表帖子”所链接的是发表帖子的页面add.asp，该页面的显示效果如图10.20所示。

10.2.2发表帖子（add.asp）

设计过程如下。

（1）在Dreamweaver中，使用表格和预先设计好的图片等素材，设计发表帖子的框架和显示效果，如图10.21所示。

（2）插入记录。

选择“插入”工具栏中的“数据”选项卡，单击“插入记录”，在【插入记录】对话框中选中【连接】为“connection”，【插入到表格】为“postMain”表，设置插入后转到“index.asp”，从页面的“form1”表单获取数据，分别对应postMain表格的相应字段，如图10.25所示。

单击【确定】按钮。

这样，当单击【提交】按钮时，就能够将页面表单form1的各元素插入到表格记录的相应字段中，从而实现了在index.asp页面显示发表的帖子。

10.2.3浏览帖子和回复帖子

在首页上可以显示发表的帖子主题，并且帖子主题设置为超链接，链接到的浏览帖子页面为show.asp，该页面的显示效果如图10.26所示。

按照图10.26的效果，在Dreamweaver中使用已有素材图片、文本和表格设计该页面，设计视图如图10.27所示。

1．浏览帖子

操作步骤如下。

（1）绑定记录集。

在制作该区域的数据显示之前，需要首先绑定记录集Recordset1。

Recordset1使用connection连接，选择【表格】为postMain，选定“全部”列，【筛选】使用main_id字段，使它等于URL传递的参数main_id，如图10.28所示。

（2）绑定数据。

在浏览帖子区域绑定Recordset1的num_hits、main_subject、main_name、main_time、main_content到页面的相应位置，如图10.29所示。

（3）设置超链接。

2．回复帖子

（1）绑定数据。

将Recordset1的main_subject字段绑定到回复帖子区域的【回复主题】右侧，如图10.30所示。

（2）插入记录。

选择“插入”工具栏中的“数据”选项卡，单击“插入记录”，在【插入记录】对话框中选中【连接】为“connection”，插入表格为“postRe”表，设置插入后转到“show.asp”，从页面的“form1”表单获取数据，分别对应postRe表格的相应字段，如图10.31所示。

3．回复内容显示

（1）绑定记录集。

在制作该区域的数据显示之前，需要首先绑定记录集Recordset2。

Recordset2使用connection连接，选择表格为postRe，选定“全部”列，筛选使用m_id字段，使它等于URL传递的参数main_id，并根据re_time字段进行降序排列，如图10.32所示。

（2）绑定数据。

（3）设置重复区域。

参照前面的操作，设置回复内容显示的区域为重复区域，设置如图10.34所示。

（4）添加导航条。

参照前面的操作，在重复区域的右下方的表格中，添加记录集导航条，导航条设置如图10.35所示。

至此，回复内容显示部分的制作完毕，该区域的最终设计视图如图10.36所示。

10.2.4帖子搜索（search.asp）

在论坛的首页设置了帖子搜索功能，用户在文本框中输入要搜索的帖子的关键字，点击“搜索”按钮，则在搜索结果页面（search.asp）上显示出符合条件的相关的帖子条目。

页面效果如图10.37所示。

操作步骤如下。

（1）设置表单。

如图10.12所示，在主页中显示的已发表的帖子的下方插入一个表单，表单中设置一个文本框，一个按钮。

（2）绑定记录集。

选择“插入”工具栏中的“数据”选项卡，单击按钮，绑定记录集Recordset1，设置【记录集】的相关选项，如图10.38所示。

（3）绑定数据。

（4）设置超链接。

（5）设置记录集合不为空的显示效果。

选择所设置的重复区域，选择“插入”工具栏中的“数据”选项卡，单击按钮，在下拉列表中选择“如果记录集不为空则显示”，在弹出的对话框中选择Recordset1，如图10.40所示。

（6）设置记录集合为空的显示效果。

在显示搜索帖子信息的表格的下方添加文本“没有相关帖子，请重新查询！

”。

选择该文本，点击工具栏中的“显示区域”按钮，在下拉列表中选择“如果记录集为空则显示”。

在弹出的对话框中选择记录集“Recordset1”，单击【确定】按钮即可，如图10.41所示。

10.2.5论坛管理

1．管理员登录（login.asp）与退出

操作步骤如下。

（1）在Dreamweaver中新建login.asp页面，新建表单form1，在表单中设置两个文本框，一个设置为text，另一个为password，并设置两个按钮，一个类型设置为submit，另一个类型设置为reset，如图10.42所示。

（2）选择“插入”工具栏中“数据”选项卡，单击“用户身份验证：

登录用户”，弹出【登录用户】

管理员登录成功，并进行管理完成后，应该可以实现退出登录。

退出后使浏览器定位到论坛首页。

操作步骤如下。

（1）在登录成功后，浏览器转到管理账号页面（adminuser.asp），在Dreamweaver中设计该页面，如图10.44所示。

（2）选中文本“退出”，选择“插入”工具栏中“数据”选项卡，单击“用户身份验证：

注销用户”，弹出【注销用户】对话框。

在该对话框中选中“单击链接”时注销，链接到选中的文本“退出”，设置【在完成后，转到】为“index.asp”页面，单击【确定】按钮完成设置，如图

为了防止用户未登录或退出后为重新登录就进入管理页面，需要进行登录安全设置。

操作步骤如下。

（1）在Dreamweaver中打开“应用程序”面板，切换到“绑定”选项卡，单击“+”按钮，选中“阶段变量”命令，在弹出的【阶段变量】对话框中，输入名称为“MM_Username”，单击【确定】按钮。

（2）切换到Dreamweaver的代码视图，输入以下代码：

<%

If（Session（"MM_Username"）=""）Then

Response.Redirect（"login.asp"）

EndIf

%>

2．管理员账号管理

（1）adminuser.asp页面的制作

登录成功后转到的页面adminuser.asp实现添加管理员账号和密码，显示数据库中已存的管理员账号和密码，并设置有修改和删除的超链接。

该页面的设计如图10.44所示，它的预览效果如图10.47所示。

①在Dreamweaver中按照如图10.44所示设计该页面，在页面设计一个表单，包括两个文本框，分别用于输入新建的用户名及其密码；两个按钮，分别是submit和reset类型；设计一个表格，用于显示已经添加的管理员账号和密码信息，以及修改和删除超链接。

②绑定记录集。

在本页绑定记录集Recordset1，如图10.48所示。

③绑定数据。

④插入记录。

⑤设置超链接。

（2）adminuserxg.asp页面的制作

在adminuser.asp页面，当点击“修改”超链接时，转到adminuserxg.asp页，该页面的设计视图如图10.52所示。

①绑定记录集1，使用usrname筛选URL传递的username参数，设置如图10.53所示。

②打开【应用程序】面板，切换到【绑定】选项卡，单击“+”按钮，选择【请求变量】命令，在弹出的【请求变量】对话框中，【类型】选择“请求”，【名称】设置为“username”，单击【确定】按钮，如图10.54所示。

③绑定请求变量username到账号名称右侧的文本框，如图10.55所示。

④更新记录。

⑤同样，在该页面设置“注销用户”服务器行为，“管理员账号管理”和“帖子管理”的链接设置与前面内容设置相同。

（3）adminuserdel.asp页面的制作

在adminuser.asp页面，当点击“删除”超链接时，转到adminuserdel.asp页，该页面的设计视图如图10.57所示。

①绑定记录集1，设置与图10.53一致。

②删除记录。

③选中文本“返回”，与adminuserxg.asp相同，设置它的超链接代码为：

history.go（-1）">返回

3．帖子管理

（1）admingl.asp页面的制作

帖子管理主页面（admingl.asp的设计视图如图10.59所示。

该页面的制作步骤如下。

①在Dreamweaver中设计页面的框架，页面顶端与adminuser.asp页面相同

②绑定记录集Recordset1，设置如图10.60所示。

③绑定Recordset1的main_subject、main_name、main_time、num_hits到页面上

④选中绑定的数据所在的行标记，设置重复区域，每页显示10条记录，并设置记录集导航条。

（2）adminglxg.asp页面的制作

adminglxg.asp页面用来显示帖子的信息和回复信息，它与show.asp页面的设计基本相同，不同的是去掉了回复帖子的功能，而且在每条回复信息处添加一个“删除”链接，如图10.61所示。

（3）delreplay.asp页面的制作

该页面实现删除回复记录的功能，设计同删除账号页面adminuserdel.asp，如图10.62所示。

不同的是【记录集】和【删除记录】的参数设置不同，设置如图10.63所示。

4）hot.asp页面的制作

新建页面hot.asp，切换到代码视图，输入以下代码：

<%@LANGUAGE="VBSCRIPT"CODEPAGE="936"%>

--#includefile="Connections/connection.asp"-->

<%

SetCommand1=Server.CreateObject（"ADODB.Command"）

Command1.ActiveConnection=MM_connection_STRING

Command1.CommandText="UPDATEpostMainSETmain_important=

 '"&request.querystring（"image"）&"'WHEREmain_id="&request.querystring（"id"）

Command1.CommandType=1

Command1.CommandTimeout=0

Command1.Prepared=true

Command1.Execute（）

Response.Redirect（"admingl.asp"）

%>

本页面的代码根据URL传递的id参数，筛选并定位到psotMain表格的main_id，从而确定记录条目，然后使用URL传递的imge参数更新psotMain表格的main_important字段。

主要的代码是该段代码的粗体部分。

（5）admintzdel.asp页面的制作

在admingl.asp页面设置文本“删除”的链接为：

id=<%=（Recordset1.Fields.Item（"main_id"）.Value）%>">

 删除

admintzdel.asp页面实现删除帖子的功能，该页面的设计与删除账号页面adminuserdel.asp相同，如图10.64所示。

不同的是【记录集】和【删除记录】的参数设置不同，设置如图10.65所示。

10.3小结

本章详细地讲解了一个典型论坛的制作过程。

该论坛使用Dreamweaver作为开发工具，采用ASP+Access模式，虽然功能比较简单，但是具有论坛的最基本的功能：

发表帖子、回复帖子、搜索帖子、对帖子和回复等进行管理。

通过本章的学习，读者能够学到Dreamweaver的数据行为，以及各页面之间的参数传递方法，本章对一些与前面的章节重叠的内容只做了简单的介绍或略过，读者可以参考前面的相关章节。

学习完本章后，读者可以尝试为论坛添加其他的功能。