【Dreamweaver+ASP】【第13章 网店购物车】

第13章网店购物车一个网站开展了电子商务，把琳琅满目的商品呈现在用户的面前。这也就实现了电子商务在线交易的前提。怎样才能为用户提供友好完整的购物流程呢？至关重要的一步就是让用户放置选购商品的购物车功能。利用Dreamweaver为网站设计编写一套网店购物车系统需要做哪些安排？需要做哪些操作？其实并不复杂，简单的电子商务这旅从这开始。13.1购物信息库的设计一个简单的网店购物车系统必须具备一套完善的购物信息库。在这个库中通常会包括两个表：商品信息表（tb_goods）、购物信息表(tb_shopping)。下面就具体来介绍整个购物信息库（Access数据库）的设计流程。（1）单击【开始】|【程序】|【MicrosoftOffice】|【MicrosoftOfficeAccess2003】命令，打开【MicrosoftAccess】窗口。（2）单击【新建文件】|【空数据库】命令，弹出【文件新建数据库】对话框。可以根据实际情况，保存到相应位置。并在【文件名】文本框中输入数据库文件名，例如“shopping.mdb”，如图13.1所示。图13.1【文件新建数据库】对话框（3）单击【创建】按钮，弹出【shopping:数据库（Access2000文件格式）】窗口，如图13.2所示。·301·图13.2【shopping:数据库（Access2000文件格式）】窗口（4）单击【使用设计器创建表】按钮，弹出【表1：表】设计窗口。单击【文件】|【保存】命令，把表进行重新命名，例如“tb_goods”。（5）在【tb_goods：表】设计窗口中按照表13.1所示定义所有字段信息。表13.1【tb_goods：表】所有字段信息字段名称数据类型说明id自动编号商品编号Title文本商品名称Price数字交易价格saler文本卖家称呼img文本图片说明（6）右击“id”字段，选择【主键】命令，为表设置主键，如图13.3所示。（7）单击窗口右上角的【关闭】按钮，系统会提示保存所做的修改。返回到【shopping:数据库（Access2000文件格式）】窗口，会发现所设计的表“tb_goods”已经存在于当中，如图13.4所示。图13.3为表设置主键图13.4【shopping:数据库（Access2000文件格式）】窗口（8）在实际操作中，可以双击打开“tb_goods”表记录管理窗口。在这个窗口中，可以选择录入、编辑或者删除一些记录信息，如图13.5所示。·302·图13.5“tb_goods”表记录管理窗口（9）单击【使用设计器创建表】按钮，弹出【表1：表】设计窗口。单击【文件】|【保存】命令，把表进行重新命名，例如“tb_shopping”。（10）在【tb_shopping：表】设计窗口中按照表13.2所示定义所有字段信息。表13.2【tb_shopping：表】所有字段信息字段名称数据类型说明id自动编号交易编号goodid数字商品编号dt日期/时间交易时间（11）选择“dt”字段，在【默认值】文本框中输入“now()”。目的是把当前时间做为记录新增时，“dt”字段的默认值，如图13.6所示。（12）右击“id”字段，选择【主键】命令，为表设置主键，如图13.7所示。图13.6“dt”字段的默认值设置图13.7为表设置主键（13）单击窗口右上角的【关闭】按钮，系统会提示保存所做的修改。返回到【shopping:数据库（Access2000文件格式）】窗口，会发现所设计的表“tb_shopping”已经存在于当中，如图13.8所示。（14）打开Dreamweaver的设计界面。单击【文件】|【新建】命令，新建一个标准ASP文件。（15）单击【窗口】|【数据库】命令，弹出【应用程序】面板，如图13.9所示。·303·图13.8【shopping:数据库（Access2000文件格式）】窗口图13.9【应用程序】面板（16）单击【＋】|【自定义连接字符串】命令，弹出【自定义连接字符串】对话框。在【连接名称】文本框中输入“conn”。在【连接字符串】文本框中输入“Driver={MicrosoftAccessDriver(*.mdb)};DBQ=i:\site\data\shopping.mdb”。选中【Dreamweaver应连接】选项组下的【使用此计算机的驱动程序】选项，如图13.10所示。（13）单击【测试】按钮，如果连接创建成功，将弹出如图13.11所示的对话框。图13.10【自定义连接字符串】对话框图13.11连接创建成功提示（14）单击【确定】按钮，关闭【自定义连接字符串】对话框。返回【应用程序】面板，向导将自动在其下拉列表中添加一条【conn】的列表选项，如图13.12所示。（15）单击【窗口】|【文件】命令，弹出【文件】面板。将看到在站点目录下会自动创建一个名为“Connections”的文件夹。在其下将会新增一个名为“conn.asp”的文件，如图13.13所示。图13.12【应用程序】面板图13.13【文件】列表面板·304·13.2商品展示的实现商品展示功能用来显示商品的基本信息，如商品的图片、名称、定价和卖家名称。通过展示功能，帮助用户选择商品。13.2.1商品展示页面设计商品展示页面读取所有商品信息，并分页显示商品信息。商品展示页面设计如下所示。（1）打开Dreamweaver的设计界面。单击【文件】|【新建】命令，新建一个名为“list.asp”的标准ASP文件。（2）单击Dreamweaver【插入】工具栏中【常用】|【表格】命令。在弹出的【表格】对话框中进行相应设置，在【文档】窗口中插入了一些表格用于定位。（3）根据实际情况，可以对特定的单元格进行宽度和背景图片的指定，来修饰表格的外观。在此基础上，再对单元格行适当的排版，录入相应的文字信息具体效果如图13.14所示。图13.14商品展示页面排版（4）单击【窗口】|【绑定】命令，弹出【应用程序】面板，如图13.15所示。（5）单击【＋】|【记录集（查询）】命令，弹出【记录集】对话框。在【名称】文本框中输入“rs”。在【连接】下拉列表中选择【conn】选项。【表格】下拉列表中选择【tb_goods】选项，如图13.16所示。·305·图13.15【绑定】命令图13.16【记录集】对话框（6）单击【测试】按钮，如果记录集创建成功，将弹出如图13.17所示的对话框。（7）单击【确定】按钮，关闭【记录集】对话框。返回【应用程序】面板，向导将自动在其下拉列表中添加一条【rs】的列表选项，如图13.18所示。图13.17记录集创建测试图13.18【应用程序】面板（8）在显示“商品名称”所对应的表格单元格中单击鼠标。在【应用程序】面板中选中【记录集（rs）】|【title】选项。单击【插入】按钮，把“title”字段插入到单元格中。用上述同样的的方法，在“交易价格”和“卖家称呼”所对应的单元格中插入记录集字段，如图13.19所示。·306·图13.19插入所有记录集字段（9）选中用于显示商品“图片说明”的图片对象，在【属性】检查器中【源文件】文本框中输入“%=(rs.Fields.Item(img).Value)%”，如图13.20所示。图13.20“图片说明”对象（10）选中“购买”按钮，在【属性】检查器中【链接】文本框中输入“buy.asp?id=%=(rs.Fields.Item(id).Value)%”，如图13.21所示。图13.21“购买”按钮（11）单击【窗口】|【服务器行为】命令，弹出【应用程序】面板，如图13.22所示。·307·图13.22【应用程序】面板（12）直接通过鼠标或者借助【标签选择器】选中表格内用于显示数据的表格，如图13.23所示。图13.23【标签选择器】（13）单击【＋】|【重复区域】命令，弹出【重复区域】对话框。在【记录集】下拉列表中选择【rs】选项。在【显示】选项组文本框中输入“5”，如图13.24所示。单击【确定】按钮，关闭对话框。（14）把鼠标定位到用于放置分页信息的区域。单击【插入】|【应用程序对象】|【显示记录记数】|【记录集导航状态】命令，弹出【RecordsetNavigationStates】对话框。在【Recordset】下拉列表中选择【rs】选项，如图13.25所示。图13.24【重复区域】对话框图13.25【RecordsetNavigationStates】对话框（15）单击【确定】按钮，关闭对话框。Dreamweave将在文档窗口中自动插入一排用于记录统计的信息，如图13.26所示。图13.26插入记录集导航状态（16）把鼠标定位到用于放置分页控制的按钮区域。单击【插入】|【应用程序对象】|【记录集分页】|【记录集导航条】命令，弹出【记录集导航条】对话框。在【记录集】下拉列表中选择【rs】选项。在【显示方式】选项组中选中【文本】选项，如图13.27所示。·308·图13.27【记录集导航条】对话框（17）单击【确定】按钮，关闭对话框。Dreamweave将在文档窗口中自动插入一排用于翻页控制的导航条，如图13.28所示。启动InternetExplorer，在地址栏中输入“”。将会看到如图13.29所示的效果。图13.28插入记录集导航条图13.29查看“”13.2.2生成代码分析——商品分页列表页面（list.asp）商品分页列表页面（list.asp），完整代码如下：%@LANGUAGE=VBSCRIPTCODEPAGE=936%!--#includefile=Connections/conn.asp--%Dimrs'定义记录集变量Dimrs_numRows'定义记录当前记录位置的变量Setrs=Server.CreateObject(ADODB.Recordset)'建立记录集对象rs.ActiveConnection=MM_conn_STRING'指定数据库链接字符串rs.Source=SELECT*FROMtb_goodsrs.CursorType=0rs.CursorLocation=2rs.LockType=1rs.Open()'获取记录rs_numRows=0·309·%%DimRepeat1__numRows'定义显示记录的总数目变量DimRepeat1__index'定义显示记录的数目变量Repeat1__numRows=5Repeat1__index=0rs_numRows=rs_numRows+Repeat1__numRows%%'***RecordsetStats,MoveToRecord,andGoToRecord:declarestatsvariablesDimrs_total'定义记录总数变量Dimrs_first'定义初始行变量Dimrs_last'定义结束行变量'settherecordcountrs_total=rs.RecordCount'获取记录集总数'setthenumberofrowsdisplayedonthispageIf(rs_numRows0)Thenrs_numRows=rs_totalElseif(rs_numRows=0)Thenrs_numRows=1EndIf'setthefirstandlastdisplayedrecordrs_first=1'设置开始行为1rs_last=rs_first+rs_numRows-1'计算结束行'ifwehavethecorrectrecordcount,checktheotherstatsIf(rs_total-1)Then'如果记录集总数正确If(rs_firstrs_total)Thenrs_first=rs_totalEndIfIf(rs_lastrs_total)Then'如果结束行数大约记录总数rs_last=rs_totalEndIfIf(rs_numRo