图8 商品信息查询页面设计效果
商品信息查询页面中涉及的HTML表单元素如表4所示。
表4 商品信息查询页面中涉及的HTML表单元素
名称 类型 含义 重要属性
myform form 表单 action="checkspindex.asp" method="post" target="mainF"
sel select 选择查询字段 <option value="spname" selected>商品名称</option>
……
<option value="gg">规格</option>
tsel select 选择条件运算符 <option value="=" selected>等于</option>
<option value="like">LIKE</option>
qname text 输入查询关键字 id="qname" onkeyup="ti()"
Submit button 【查询】按钮 onclick="send()"
but button 【显示全部数据】按钮 id="but" onclick="list()"
用户可以在商品信息查询页面中的查询部分，输入一定的条件进行商品信息的查询。
利用java script编写检测用户输入信息是否为空的函数，并通过单击【查询】按钮调用该函数，当用户输入合法信息后，提交该表单。关键代码如下：
<script language="java script">
function send()
{if (myform.qname.value=="")
{alert("请输入查询内容");myform.qname.focus();return false} //弹出提示对话框，并把焦点停留在指定位置
myform.submit()
}
</script>
应用java script动态向select中添加一个新的选项“all”，并将该选项设置为被选择的项，通过单击【显示全部数据】按钮调用该函数。关键代码如下：
<script language="java script">
function list(){
myform.tptsel.options[myform.tptsel.length]=new Option("all","all");
myform.tptsel[myform.tptsel.length-1].selected=true;
myform.submit()
}
</script>
商品信息展示页面检索数据库的程序代码如下：
<%
path=request.servervariables("path_info")
set conn=server.createobject("adodb.connection") '创建数据库对象
set rs=server.createobject("adodb.recordset") '创建记录集对象
conn.open application("dsn") '打开数据库
if request("tptsel")<>"" then
tj=request("tptsel")
lname=request("qname")
jname=request("sel")
session("tj")=tj
session("lname")=lname
session("jname")=jname
end if
'查询
if session("tj")="=" then '精确查询
sql="select * from tab_spinfo where "&session("jname")&"='"&session("lname")&"'"
end if
if session("tj")="like" then '模糊查询
sql="select * from tab_spinfo where "&session("jname")&" like '%"&session("lname")&"%'"
end if
if session("tj")="all" then '查询全部
sql="select * from tab_spinfo"
end if
rs.open sql,conn,1,3
%>
分页显示查询结果的代码如下：
<%'分页
rs.pagesize=5 '每页显示的记录数
page=clng(request("page")) '获取当前页码
if page<1 then page=1
if page>rs.pagecount then page=rs.pagecount
show rs,page
'分页子程序开始
sub show(rs,page)
rs.absolutepage=page &nbs
