Dreamweave动态网页使用数据库.

一个使用数据库的实例表单制作完成后是静态的，接下来要为表单设计数据库，让表单与数据库连接，并开发出功能完备的网站应用程序，表单才有实用价值。

Dreamweaver MX 2004提供了用可视化方式设计互动网页的方法。

下面介绍一个使用数据库的简单实例。

采用的操作系统是Windows XP+IIS 5.0，采用的数据库是Access 2000。

1 建立站点和网页文件1．建立本地文件夹：C:\Inetpub\wwwroot\classmate2．在Dreamweaver中建立“classmate”站点指向本地文件夹。

建立站点的方法参见第2章。

站点设置如图9-23所示。

图9-23 建立站点指向本地目录3．打开“文件”面板→选择classmate站点→新建4个文件：input.asp、show.asp、edit.asp、delete.asp，分别完成输入、显示、修改、删除数据的功能。

2 确定站点测试服务器确定站点测试服务器的步骤如下：1．在“管理站点”对话框中选择classmate→单击“编辑”按钮→显示“站点定义”对话框→在“分类”项中选定“测试服务器”。

2．单击“服务器模型”框下拉按钮→在提供的选项中选择一种动态脚本语言，本例选择了ASP JavaScript。

3．在“访问”框中选择“本地/网络”。

4．在“测试服务器文件夹”框中选择刚才建好的本地站点文件夹，“URL前缀”框中会自动显示相应内容。

“测试服务器”设置如图9-24所示。

图9-24 设置“测试服务器”3 用Access建立数据库和数据表在Access中建立数据库和数据表的步骤如下：1．启动Access→新建数据库→将建立的数据库以“classmate”为名字保存在本地站点文件夹中。

2．在“classmate”数据库中新建名为“tx”的数据表→关闭Access。

表结构如图9-25所示。

图9-25 建立“tx”的数据表3．在Dreamweaver的“文件”面板中可以看到新建的数据库文件已经在站点中。

如图9-26所示。

3图9-26 站点中可以看到数据库文件4 建立数据库的连接在Dreamweaver MX 2004中进行数据库的连接的步骤如下：1．打开“控制面板”→双击“管理工具”→选择“ODBC数据源”。

显示“ODBC 数据源管理器”对话框，如图9-27所示。

图9-27 ODBC数据源管理器ODBC是开放式数据库互连标准，类似于一种通用翻译器，为每种特定的数据库类型指配驱动程序。

为了简化ODBC连接过程，建立了DSN(数据源名称)协议，DSN是数据源实际位置的别名。

Windows系统中，本地DSN由ODBC数据源管理器管理，远端DSN由系统管理员在服务器上建立。

2．单击“系统DSN”选项卡→单击“添加”按钮→显示“创建新数据源”对话框→在名称列表中选择Microsoft Access Driver(*.mdb)。

如图9-28所示。

图9-28 “创建新数据源”对话框3．单击“完成”按钮→弹出“ODBC Microsoft Access安装”对话框→为数据源起名为classmate。

如图9-29所示。

图9-29 “ODBC Microsoft Access安装”对话框4．单击“选择…”按钮→弹出“选择数据库”对话框→选择本地站点文件夹→选择数据库。

如图9-30所示。

5图9-30 “选择数据库”对话框5．单击“确定”按钮→回到“ODBC数据源管理器”窗口。

可以看到classmate已经在系统数据源名称中，这就是要使用的数据库。

如图9-31所示。

图9-31 一个新的数据源创建成功5 制作输入数据的动态网页1．在“文件”面板中双击input.asp打开该网页文件→参照数据表tx的结构建立表单。

如图9-32所示。

图9-32 制作输入数据的动态网页2．打开“数据库”面板→单击按钮→在下拉菜单中选“数据源名称”，开始为输入数据的网页文件定义数据库连接。

如图9-33所示。

图9-33 为输入数据的网页文件定义数据库连接3．在随后打开的“数据源名称(DSN)”对话框中设置参数→选择数据源名称→为数据源连接起一个连接名称→如果没有DSN可以单击“定义”按钮进行定义→单击“确定”按钮。

如图9-34所示。

图9-34 选择数据源与定义数据源名称4．在“数据库”面板中可以看到所建立的数据库连接，展开后可以看到这个数据库中的所有元素和数据表的信息。

如图9-35所示。

7图9-35 查看数据库和数据表的信息5．打开“服务器行为”面板→单击按钮→在下拉菜单中选择“插入记录”，如图9-36所示。

插入记录操作将使表单与数据表建立联系。

图9-36 插入记录操作6．在弹出的“插入记录”对话框中将窗体字段与数据表字段配对。

(1) 在“连接”框中输入连接名称。

本例选classmate。

(2) 在“插入到表格”框中选择数据库中的数据表。

本例选tx。

(3) 在“插入后转到”框中选择当前站点中一个网页文件，本例选show.asp，当在input.asp中单击“提交”按钮后，会打开show.asp网页。

(4) 在“获取值自”框中选择表单名称。

本例选form1。

(5) 选中一个表单元素名称，在“列”框中选一个表的字段名，完成窗体字段与数据表字段的配对。

如图9-37所示。

图9-37 将窗体字段与数据表字段配对7．全部配对完毕后单击“确定”按钮，可以看到“服务器行为”面板中添加了一个插入记录行为。

如图9-38所示。

图9-38 添加插入记录行为8．打开输入信息的网页文件input.asp→按F12键浏览网页→在表单中输入数据→单击“提交”按钮→显示show.asp。

9．关闭show.asp→在“文件”面板中双击库文件名打开库→双击表名打开表。

可以看到在表单中输入的信息已经存在表中了。

6 制作显示数据的动态网页1．在“文件”面板中双击show.asp打开该文件→画一个3行2列表格→选中表格→在属性面板中设置表格的边框为0。

2．打开“绑定”面板→单击按钮→在显示的菜单中选“记录集”。

建立一个数据库查询的数据记录。

如图9-39所示。

9图9-39建立一个数据库查询的数据记录3．在接下来显示的“记录集”对话框中设置参数，如图9-40所示。

如果“连接”框中没有可选择的连接，单击“定义”按钮重新设置一个。

“排序”框中选择ID，排序次序选择“降序”，使最新提交的表单显示在最前面。

图9-40 设置“记录集”4．单击“测试”按钮可以预先查看记录排序的结果。

如图9-41所示。

图9-41 预先查看记录排序的结果5．单击“确定”按钮，可以看到“绑定”面板中有一个名为rs的记录集。

6．展开“绑定”面板中的记录集→在表格第1行第2列单击→选定“绑定”面板记录集的xm字段→单击“绑定”面板下方的“插入”按钮。

如图9-42所示。

图9-42 将“绑定”面板的字段插入到表格中7．全部字段绑定到表格后，表格如图9-43所示。

图9-43 全部字段绑定到表格8．选定表格→打开“服务器行为”面板→选“重复区域”。

如图9-44所示。

用“重复区域”功能可以使一页显示多条记录。

图9-44 启用“重复区域”功能9．在“重复区域”对话框中设置每页显示3条记录。

如图9-45所示。

图9-45 设置每页显示3条记录10．设置完成后表格上方有“重复”标记，如图9-46所示。

为表格插入一条水平线作为记录的分隔线。

图9-46 设置完成后的表格11．按F12键浏览show.asp。

结果如图9-47所示。

图9-47 show.asp的显示结果7 制作修改数据的动态网页1．在show.asp中添加“修改”文字→选中文字→打开“服务器行为”面板→单击按钮→选择“转到详细页”→在对话框设置参数→单击“确定”按钮。

“修改”文字成为包含动态内容的超链接。

对话框设置如图9-48所示。

用id作为表单数据与表数据的匹配参数。

图9-48 “转到详细页”对话框2．关闭show.asp→打开edit.asp→建立一个数据查询记录集，方法与在show.asp中操作的相同。

3．在edit.asp中建立表单→第1 行是ID字段。

每条记录将根据ID惟一确定。

表单如图9-49所示。

图9-49 在edit.asp中建立表单4．单击“服务器行为”面板按钮→选择“记录集分页”→继续选“移至特定记录”→显示“移至特定记录”对话框。

“移至特定记录”的作用是移动当前记录集中的记录指针到合适位置。

选择id作为参数找出数据库里对应的记录，进而将数据库内容显示在页面上。

参数设置如图9-50所示。

图9-50 “移至特定记录”对话框5．在表单中选定位置→在“绑定”面板中选定字段→单击“绑定”面板下方的“插入”按钮，将数据库中的字段绑定到表单的相应位置中。

如图9-51所示。

图9-51 数据库中的字段绑定到表单的相应字段中6．单击“服务器行为”面板按钮→选择“更新记录”→在对话框中设置参数。

如图9-52所示。

定义更新后显示show.asp页面。

图9-52 更新记录设置7．打开show.asp→单击一个记录下的“修改”文字→显示edit.asp页面→在edit.asp 页面的表单中修改数据，如图9-53所示。

图9-53在edit.asp页面的表单中修改数据8．修改数据后单击“提交”按钮→显示show.asp页面→修改后的结果会立即在show.asp页面显示出来。

如图9-54所示。

图9-54 显示修改后的结果8 制作删除数据的动态网页1．在show.asp页面中添加“删除”文字→选中文字→单击“服务器行为”面板按钮→选择“转到详细页面”→设置参数如图9-55所示。

图9-55 给“删除”文字设置服务器行为2．在delete.asp上建表单→使表单字段的名称与数据库中数据表字段名称一致→用前面相同的方法设置“移至特定记录”→将数据库中的字段绑定到表单的相应字段中。

如图9-56所示。

图9-56 删除页面的设置3．单击“服务器行为”面板按钮→选择“删除记录”→在“删除记录”对话框中设置参数。

如图9-57所示。

图9-57 设置“删除记录”参数4．“服务器行为”面板中记载了对当前页所进行的操作。

如图9-58所示。

图9-58 对当前页所进行的操作5．制作一个显示删除成功的页面ok.asp，删除完成后显示该页面。

6．运行show.asp，如图9-59所示。

图9-59 运行show.asp7．单击“删除”文字将显示delete.asp页面。

如图9-60所示。

图9-60单击“删除”文字将显示delete.asp页面8．在delete.asp页面中单击“确定”按钮将显示ok.asp页面。

如图9-61所示。

图9-61 删除成功后显示ok.asp页面习题与思考题九1．什么是动态网站？动态网站的核心是什么？2．什么是表单？表单在动态网站中起什么作用?3．表单中有哪些表单对象？4．建立一个站点用来收集用户信息。