当前位置: 首页 > 图文教程 > 网页制作 > Dreamweaver > DW MX实例:实现产品搜索

Dreamweaver
Dreamweaver打造多彩文字链接
Dreamweaver基础技巧全面接触
Dreamweaver MX 2004从零开始(4)
Dreamweaver MX 2004设计留言本实战
Dreamweaver MX 2004从零开始(5)
Dreamweaver MX 2004从零开始(6)
Dreamweaver MX 2004从零开始(7)
Dreamweaver MX 2004 打造细线表格
在DW中插入Flash的参数详解
用Dreamweaver MX建设神奇网页图片超链接
Dreamweaver中实现flash的透明背景
DreamweaverMX打造留言本(二)
DreamweaverMX打造留言本(三)
DreamweaverMX打造留言本(四)
DreamweaverMX打造留言本(五)
Dreamweaver MX技巧汇粹
DreamwaverMX与ASP.NET(一)
DreamwaverMX与ASP.NET(二)
DreamwaverMX与ASP.NET(三)
DreamwaverMX与ASP.NET(四)

Dreamweaver 中的 DW MX实例:实现产品搜索


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-11-23   浏览: 72 ::
收藏到网摘: n/a

  
Dreamweaver


  客户在浏览公司网站时,常常会对一些产品进行较为简单的查询搜索,本实例将讲解其实现过程。

  效果说明 客户可以在如图 86-1 所示的页面中选择特别查询字段,输入查询数据,对产品进行模糊查询,结果如图 86-2 所示。

  创作构思 在“ index.aspx ”页面中添加下拉列表、文本框及按钮,完成产品搜索页面的设置,制作出跟实例 85 中树形目录索引显示页面相同的页面作为产品搜索页面,然后设置程序以实现产品搜索。

  
Dreamweaver


  操作步骤

  步骤一 产品搜索页面的设置

  ( 1 )在“ LeftTb ”表格中添加 4 行并设置样式。打开“ index.aspx ”,在设计视图里的“ LeftTb ”表格中添加 4 行并设置样式,如图 86-3 中圆角方框所示。

  ( 2 )添加控件。单击 ASP.NET 快捷菜单栏上的【 asp :下拉列表】按钮,为新添加的第 2 行添加下拉列表控件,如图 86-4 所示。

  
Dreamweaver


  ( 3 )添加列表标签及相应的值。在新添加的下拉列表“ FieldList ”属性窗口中单击【列表项】按钮,在弹出的【列表项】对话框中添加 3 个标签,一个标签为“产品编号”,其值为“ CPID ”;一个标签为“产品名”,其值为“ CPNAME ”;一个标签为“产品分类”,其值为“ CPFL ”,结果如图 86-5 所示。

  ( 4 )继续在新添加的行中添加文本框,设 ID 为“ SearchTxt ”,并添加两个按钮,一个按钮为“搜索”, ID 为“ GoBt ”;另一个按钮为“高级搜索”, ID 为“ TopgoBt ”,结果如图 86-6 所示。

  
Dreamweaver

  步骤二 实现产品搜索

  ( 1 )切换到代码视图,在“ <script Runat="Server"> ”中添加“ GoBt_click ”过程,其代码如下所述。

  Sub GoBt_Click(ByVal sender As Object, ByVal e As System.EventArgs)

  Response.Redirect("CpSearch.aspx?keyfield="+SearchTxt.Text+"keyindex="+ FieldList.SelectedValue)

  End Sub

  (读者可打开【光盘】|【源文件】|【实例 86 】|【 86.1.txt 】文件,直接复制)

  程序说明:

  单击【搜索】按钮,则执行该过程。该过程主要是将页面指向“ CpSearch.aspx ”,并传递“ keyfield ”、“ keyindex ”两个参数。“ keyfield ”参数用于存储客户搜索时在【 FieldList 】下拉列表中选择的关键字段,“ keyindex ”参数用于存储客户搜索时在【 SearchTxt 】文本框中输入的数据。

  ( 2 )在“ <script Runat="Server"> ”中添加另一个过程“ TopgoBt_Click ”,其代码如下所述。

  Sub TopgoBt_Click(ByVal sender As Object, ByVal e As System.EventArgs)

  Response.Redirect("TopSearch.aspx")

  End Sub

  (读者可打开【光盘】|【源文件】|【实例 86 】|【 86.2.txt 】文件,直接复制)

  ( 3 )绑定“ GoBt_click ”过程到【搜索】按钮的“ OnClick ”响应事件,绑定“ TopgoBt_Click ”过程到【高级搜索】按钮的“ OnClick ”响应事件。

  ( 4 )打开“ TreeSearch.aspx ”,该页面是在实例 85 中建立的,用于显示单击树形目录节点进行搜索后的结果。由于产品搜索结果显示页面与树形目录搜索的结果显示页面设计相同,所以可以直接将其另存为“ CpSearch.aspx ”。

  ( 5 )修改数据集“ TrSearchData ”查询命令。虽然产品搜索结果显示页面与树形目录搜索结果显示页面设计相同,但是搜索的查询命令显然是不同的,所以要对页面中数据集“ TrSearchData ”有关查询命令进行修改。删除“ CpSearch.aspx ”页面中的“ Page_Load ”过程,重新添加如下所述的过程。

  Sub Page_Load(ByVal Sender As Object, ByVal e As EventArgs)

  TrSearchData.CommandText="SELECT * FROM DreamweaverCP WHERE " _

  &Trim(Request.QueryString("keyindex"))& " LIKE '%" _

  &Trim(Request.QueryString("keyfield"))&"%' ORDER BY CPID ASC"

  TrSearchData.Debug=true

  End Sub

  (读者可打开【光盘】|【源文件】|【实例 86 】|【