学用DW做ASP实例—留言板

动态数据库网页本讲要点1、配置动态服务器IIS 2、建立动态站点3、创建动态页面4、创建数据库链接5、制作表单文档一、动态站点概述何为动态一种具有“交互性”的页面效果即网页会根据用户的要求和选择而动态改变和响应。制作动态网页需要做的工作有第一要在个人电脑上调试动态网页。第二使用数据库技术。第三在Dreamweaver中建立动态站点。二、配置IIS服务器1安装IIS服务器2设置IIS 3测试ASP动态网页1安装IIS服务器1执行【开始】【控制面板】命令打开【控制面板】。2双击【添加或删除程序】图标打开【添加或删除程序】窗口。3单击【添加/删除Windows组件】打开【Windows组件向导】对话框。4选择【Internet信息服务IIS】复选项。5单击【下一步】按钮开始安装IIS服务器。安装完成后的窗口如下图所示。2设置IIS 首先在D盘下面建立一个“liuyanban”的文件夹用来存放留言板动态页面文件。其次通过以下的步骤来设置站点虚拟目录1从【控制面板】窗口打开【管理工具】在打开的【管理工具】窗口中选择【Internet信息服务快捷方式】。2设置IIS 2双击【Internet信息服务快捷方式】选项在弹出的【Internet信息服务】窗口左边窗格中右击【默认网站】项在弹出的菜单中执行【新建】【虚拟目录】命令弹出【虚拟目录创建向导】窗口如右图所示。2设置IIS 3单击【下一步】按钮继续。如左图所示在【别名】下面的文本框中输入

“liuyanban”。单击【下一步】按钮继续。如右图所示在【目录】下边的文本框中输入“D:liuyanban”或者单击【浏览】按钮找到D盘的“liuyanban”文件夹。3测试ASP动态网页在【Internet信息服务】窗口右边的窗格中找到建立的ASP动态页面右键单击后在弹出的快捷菜单中选择【浏览】项即可如图8-15所示。三、创建留言板主页面1、建立动态站点2、创建留言板页面建立动态站点1定义站点。建立动态站点2选择服务器技术。建立动态站点3选择存放的本地文件夹。建立动态站点4设置本机测试的URL。建立动态站点5单击【下一步】按钮继续进行设置。由于是在本机测试并不需要远程服务器参与所以选择【否】项。建立动态站点6单击【下一步】按钮继续。窗口显示了所填写的信息确认一下。如果发现有错可以单击【上一步】按钮返回修改设置确认无误后就可以单击【完成】按钮。这时动态站点就定义完成了现在可以在DW中进行动态网页的设计了。创建留言板页面1创建留言板主页面ASP文档。2用表格布局留言板主页面。3在表格中插入一些显示元素。四、用Access创建数据库1创建空数据库文档2创建留言板用户信息表3创建管理员信息数据表1创建空数据库文档1新建一个名为data的文件夹然后将空数据库文件保存在data

文件夹下文件名为liuyanban_data.mdb。1创建空数据库文档2单击【创建】按钮创建一个名为liuyanban_data的数据

库文件同时出现一个相应的数据库设计窗口如图所示。1创建空数据库文档3双击【使用设计器创建表】命令弹出一个表设计器窗口如图所示。表的结构设计将在其中完成。2创建留言板用户信息表1创建字段域。最后的结果如图所示。2创建留言板用户信息表2设置用户信息数据表的主键字段。3设置字段属性。用户信息数据表设计完成以后关闭表设计器窗口可以看到数据库设计窗口中多了一个名字为yonghu的数据表如下图所示。3创建管理员信息数据表创建一个用来存储和管理留言板管理员的信息的数据表名字

为_guest创建结果如下图所示。最终的数据库设计窗口如下图所示。五、留言板的逐步实现1、创建数据库链接2、留言板主页面的动态效果3、创建用户留言页面4、在留言板主页面实现留言记录导航一、创建数据库链接1定义系统DSN 数据源名称2通过DSN实现连接1定义系统DSN 数据源名称1打开【控制面板】双击其中的【管理工具】图标在转换到的【管理工具】窗口中可以看到一个【数据源ODBC】图标。2双击【数据源ODBC】图标打开【ODBC 数据源管理器】对话框切换到【系统DSN】选项卡如图所示。1定义系统DSN 数据源名称3添加一个新的系统DSN名称。单击【添加】按钮弹出【创建新数据源】对话框在其中选择“Driver do Microsoft Access.mdb”项如图所示。1定义系统DSN 数据源名称4单击【完成】按钮以后弹出【ODBC

Microsoft Access安装】对话框在其中定义数据源名并选取数据库文件。设置后如右图所示。1定义系统DSN 数据源名称5单击【确定】按钮完成数据库的选择这时的【ODBC Microsoft Access安装】对话框如下图所示。6经过上面步骤的操作以后在上图所示的对话框中就会显示一个新定义的数据源名称。2通过DSN实现连接打开留言板站点的主页面文档main.asp。在【应用程序】面板中的【数据库】面板下单击加号按钮在弹出的下拉菜单中单击【数据源名称】项如图所示。2通过DSN实现连接在【数据源名称】对话框的【连接名称】文本框中输入数据源连接名称在【数据源名称】下拉列表中选择名字为“liuyanban”的DSN其他参数保持默认值如图所示。2通过DSN实现连接单击【确定】以后【数据库】面板就会出现新定义的连接名称单击它前面的加号按钮展开可以看到留言板数据库中的两个表如图所示。这时就完成数据库和留言板站点的连接了连接名是liuyb。

二、留言板主页面的动态效果1在【绑定】面板中定义记录集2将记录集中数据绑定到表格域1在【绑定】面板中定义记录集在Dreamweaver中打开留言板站点主页面main.asp。打开【绑定】面板单击加号按钮在弹出的下拉菜单中执行【记录集查询】命令如图所示。1在【绑定】面板中定义记录集在弹出的【记录集】对话框中定义记录集【名称】为i、选择数据库【连接】名为liuyb、选择数据库中的

【表格】为yonghu、选择表中的字段域、定义记录排序的方法等如图所示。1在【绑定】面板中定义记录集按照前面的步骤操作完成以后在【绑定】面板中就会出现新定义的记录集单击它前面的加号按钮可以展开记录集如图所示。2将记录集中数据绑定到表格域1重新编辑留言板主页面。对留言板主页面main.asp中的表格重新编辑并删除单元格中的一些文字和图片如图所示。2将记录集中数据绑定到表格域2将记录集中的数据域字段绑定到表格相应的单元格中。打开【绑定】面板展开记录集。用鼠标将记录集中的y_name字段拖放到页面表格的左上角中用同样的方法将其他数据域

字段拖动到相应的单元格中结果如图所示。三、创建用户留言页面1添加表单并布局表格2添加表单域3定义提交按钮的服务器行为4在【行为】面板定义表单提交的错误检查1添加表单并布局表格新建一个动态页面并将其保存为“write.asp”它就是用户留言页面。在【表单】工具栏中单击【表单】按钮插入一个表单。然后在表单中插入一个表格表格布局如图所示。2添加表单域1添加“姓名”文本字段。通过【表单】工具栏中的【文本字段】按钮完成在单元格中添加一个“文本字段”表单域。在【属性】面板中【文本域】下面的文本框中定义这个文本字段的名字为name如图所示。2添加表单域2添加OICQ、E-mail、个人主页文本字段。OICQ、E-mail、个人主页表单域的添加方法同上均为文本字段在【属

性】面板中各个文本字段的命名情况是OICQ文本字段oicq E-mail文本字段mail 个人主页文本字段homepage。2添加表单域3添加“性别”单选按钮表单域性别“男”的单选按钮属性设置如图所示。2添加表单域同样的方法再设置一个性别“女”的单选按钮。完成后的页面效果如下图所示。2添加表单域4添加“选择头像”表单域。因为“选择头像”右边的单元格中要有若干备选的头像图片所以我们应该事先制作

或者搜集一些卡通头像图片。复制以后的【文件】面板情况如图所示。2添加表单域将光标定位在“选择头像”右边的单元格中分两行插入8个头像图片。在每幅图片的右边添加一个单选按钮。名字统一定义为tx第一个单选按钮的【初始状态】选择为【已勾选】其他的单选按钮为【未选中】每个单选按钮【选定值】属性的设置稍微麻烦一些。2添加表单域以第1个单选按钮为例先选中这个单选按钮前面对应的头像图片在【属性】面板中复制这个图片【源文件】地址如图所示。2添加表单域再选中与头像对应的单选按钮在【属性】面板的【选定值】处粘贴刚才复制的头像图片源文件地址如图所示。2添加表单域其他7个单选按钮的【选定值】属性都按照同样的方法进行设置。最后编辑页面效果如图所示。2添加表单域5添加“留言内容”文本区域。效果如图8-60所示。2添加表单域6添加提交和重置按钮。完成以后的页面效果如图所示。2添加表单域7添加隐藏区

域。将光标定位在“提交”按钮的左边单击【表单】工具栏中的【隐藏域】按钮在【属性】面板中定义它的名字为ip在【值】文本框中输入代码3定义提交按钮的服务器行为打开【绑定】面板单击加号按钮执行【记录集查询】命令并按照图示介绍的方法绑定【记录集】。选中整个表格打开【服务器行为】面板单击加号按钮选择【插入记录】命令。在【插入记录】对话框中设置表单域与数据库字段名一一对应在【表单元素】中依次选中元素在下面的【列】中选择与数据库相对应的域。4在【行为】面板定义表单提交的错误检查选中【提交】按钮打开【行为】面板单击加号按钮在弹出的菜单中选择【检查表单】命令。设置表单域和检查事件name 选择【必需的】ociq选择【数字】mail选择选择【必需的】【电子邮件地址】homepage不选liuyan选择【必需的】如图所示。最后单击【确定】按钮事件为onClick。四在留言板主页面实现留言记录导航1实现留言记录导航2留言内容显示问题的解决1实现留言记录导航在main.asp页面实现留言记录导航主要包括控制一页显示留言数和翻页按钮上

一页、下一页、最前一页、最后一页。这个功能主要使用【应用程序】工具栏来完成。将工具栏切换到【应用程序】工具栏后得应用程序按钮如图所示。1实现留言记录导航

这里主要应用【记录集分页】按钮和【记录集导航状态】按钮。单击【记录集分页】按钮弹出如右上图所示的下拉列

表框单击【记录集导航状态】按钮弹出如右下图所示的对话框。1实现留言记录导航下面为留言板主页面添加记录导航功能1将光标定位在编辑页面的下边单击【记录集导航状态】按钮弹出【记录集导航状态】对话框单击【确定】按钮后页面如图所示。1实现留言记录导航2再回车另起一行单击【记录集分页】按钮弹出【记录集导航条】对话框如下图所示。单击【确定】按钮记录导航条将以文字方式显示。1实现留言记录导航这样就完成了显示留言数量和翻页的

按钮如图所示。2留言内容显示问题的解决需要解决的问题防止留言内容支持html代码防止留言很长时main.asp

页面上的表格被自动撑大文字不会自动换行用如下的操作解决上述问题2留言内容显示问题的解决1将原来绑定到留言内容单元格中的记录集字段删除然后在这个单元格中

添加【文本区域】表单域添加好后的文本区域如图所示。2留言内容显示问题的解决2选中刚才添加的文本区域在【属性】面板中设置【字符宽度】为66【行数】为5然后单击【绑定到动态源】按钮如图所示。2留言内容显示问题的解决3单击【绑定到动态源】按钮以后会弹出【动态数据】对话框在其中的【域】中选择记录集中的y_liuyan单击【确定】按钮。这样就将y_liuyan字段绑定到留言内容文本区域了如图所示。2留言内容显示问题的解决经过以上操作以后再次测试留言效果时会发现留言内容能自动换行了而且不支

持html代码。通过前面制作留言板站点已经初步实现了一些站点功能用户可以通过留言页面填写和提交用户信息和留言内容在留言板主页面可以显示用户留言信息可以显示留言数以及实现了导航翻页功能。