JavaScript中的可扩展列表框 [英] Expandable Listbox in javascript

查看:65
本文介绍了JavaScript中的可扩展列表框的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述



代码说明:

我有一个用于输入名称的文本框,当我输入"bo"然后从数据库中填充下拉列表时,有一个下拉列表.列表框中的值是1)bob 2)bobby 3)Bone等存在于db中.现在我的要求在下面给出.

我希望名称列表框字段自动展开,以显示与名称文本框字段中输入内容的所有匹配项.例如如果我仅在名称字段中输入"bo",那么实际上只有3个名称,但除非用户实际单击下拉列表,否则仅显示第一个名称,因此他们有时会认为这是唯一匹配且不会打扰的名称点击查看是否还有其他内容.

使列表框在上述Java脚本代码中可扩展的热点.
请尽快向我提出建议

谢谢& RegaRDS
VIBS

请检查此代码.

<%@ LANGUAGE ="VBSCRIPT"%>
<%
Response.AddHeader"Pragma","no-cache"
Response.AddHeader缓存控件",必须重新验证,私有,无缓存"
Response.Expires = -1500

%>
<%
Response.Expires = 0
关于错误继续下一个
设置DataConnPhoneBk = Server.CreateObject("ADODB.Connection")
DataConnPhoneBk.ConnectionTimeout =会话("DataConnPhoneBk_ConnectionTimeout")
DataConnPhoneBk.CommandTimeout =会话("DataConnPhoneBk_CommandTimeout")

''添加了下一行,因为ICL忘记了设置数据库的连接字符串.

DataConnPhoneBk.Open("Driver = {SQL Server}; Server = localhost; Database = WAR;")


设置cmdTemp = Server.CreateObject("ADODB.Command")
设置MapListResults = Server.CreateObject("ADODB.Recordset")
cmdTemp.CommandText =选择登录ID,用户名来自用户ORDER BY用户名"
cmdTemp.CommandType = 1
设置cmdTemp.ActiveConnection = DataConnPhoneBk
MapListResults.Open cmdTemp,,0,1

%>

<%
如果是MapListResults.EOF,则
itsgonewrong = 0
其他
itsgonewrong = 1
如果
结束
%>
<!DOCTYPE html PUBLIC-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
< html xmlns ="http://www.w3.org/1999/xhtml" xml:lang ="zh-CN" lang ="zh-CN">
< head>
< title>联合实用程序-工具-地图和地址</title>
< meta http-equiv ="Content-Type" content ="text/html; charset = iso-8859-1"/>
< link rel ="stylesheet" href ="/styles/kcmain.css" type ="text/css"/>

< script type ="text/javascript" language ="JavaScript">
调试器;

var个网站;
sites = new Array(<%
而不是MapListResults.EOF
Response.Write(Chr(34)& Trim(MapListResults("User_Name"))&"|"& Trim(MapListResults("Login_id"))& Chr(34))
MapListResults.MoveNext
如果不是MapListResults.EOF,则Response.Write(,")如果
结束 温德

%>);


函数filterSite(evt)
{
//清空ddm
document.SearchMapForm.mapsmenu.options.length = 0;

//抓取过滤器文本
txtFilter = document.SearchMapForm.filterTxt.value;

//遍历网站数组以重新填充
for(i = 0; i< sites.length; i ++)>
{
if(sites [i] .substring(0,txtFilter.length).toUpperCase()== txtFilter.toUpperCase())
{
site_ids = sites [i] .split("|");
document.SearchMapForm.mapsmenu.options.length = document.SearchMapForm.mapsmenu.options.length +1;
document.SearchMapForm.mapsmenu.options [document.SearchMapForm.mapsmenu.options.length-1] .value = site_ids [1];
document.SearchMapForm.mapsmenu.options [document.SearchMapForm.mapsmenu.options.length-1] .text = site_ids [0];
}
}
}


</script>

< style type ="text/css">

p {颜色:#000000;
字体:arial;
font-family:arial;
font-size:small;
font-weight:normal;
margin-top:15px;
margin-bottom:15px;
}
</style>

</head>
< bodyönLoad="filterSite(event)">

<%''侧边菜单%>
< form name ="SearchMapForm" id ="form1" method ="post" action ="vibs.asp">
<输入名称="filterTxt" type =文本" id ="filterTxt"önKeyUp="filterSite(event)" size ="40">


<选择name ="mapsmenu" size = 5>
<%
MapListResults.ReQuery()
而不是MapListResults.EOF
%>

< option value =<%= MapListResults(" login_id)%>"><%= MapListResults("User_Name")%></option>
<%
MapListResults.MoveNext
温德
%>
</select>


Hi,

Code Explanation:

I have one text box for name,and one dropdown when I enter ''bo'' then dropdown filled from database.Values in listbox are 1)bob 2)bobby 3)Bony etc exists in db. Now my requirement is given below.

I want the name listbox field expand automatically to show all my matches to what has been entered in the name textbox field. e.g. If I am entering just ‘bo’ in the name field actually 3 names are there but only the first is shown unless the user actually clicks the drop-down, so they sometimes assume that that is the only name that matches and don’t bother clicking to see if there are others.

Hot to make list box expandable in above java script code.?

Pls. advice me asap

Thanks & RegaRDS
VIBS

Please check this code.

<%@ LANGUAGE="VBSCRIPT" %>
<%
Response.AddHeader "Pragma", "no-cache"
Response.AddHeader "cache-control", "must-revalidate, private, no-cache"
Response.Expires = -1500

%>
<%
Response.Expires = 0
On Error Resume Next
Set DataConnPhoneBk = Server.CreateObject("ADODB.Connection")
DataConnPhoneBk.ConnectionTimeout = Session("DataConnPhoneBk_ConnectionTimeout")
DataConnPhoneBk.CommandTimeout = Session("DataConnPhoneBk_CommandTimeout")

''Next line added as ICL had forgot to setup the connection string to the database.

DataConnPhoneBk.Open ("Driver={SQL Server};Server=localhost;Database=WAR;")


Set cmdTemp = Server.CreateObject("ADODB.Command")
Set MapListResults = Server.CreateObject("ADODB.Recordset")
cmdTemp.CommandText = "SELECT Login_id, User_Name FROM User ORDER BY User_Name"
cmdTemp.CommandType = 1
Set cmdTemp.ActiveConnection = DataConnPhoneBk
MapListResults.Open cmdTemp, , 0, 1

%>

<%
If MapListResults.EOF then
itsgonewrong = 0
else
itsgonewrong = 1
end if

%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>United Utilities - Tools - Maps and Addresses</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" href="/styles/kcmain.css" type="text/css" />

<script type="text/javascript" language="JavaScript">
debugger;

var sites;
sites = new Array(<%
while Not MapListResults.EOF
Response.Write(Chr(34) & Trim(MapListResults("User_Name")) & "|" & Trim(MapListResults("Login_id")) & Chr(34))
MapListResults.MoveNext
if Not MapListResults.EOF then Response.Write(",") end if
wend

%>);


function filterSite(evt)
{
// empty the ddm
document.SearchMapForm.mapsmenu.options.length = 0;

// grab the filter text
txtFilter = document.SearchMapForm.filterTxt.value;

// loop through the array of sites to repopulate
for(i=0;i<sites.length;i++)>
{
if( sites[i].substring(0,txtFilter.length).toUpperCase() == txtFilter.toUpperCase() )
{
site_ids = sites[i].split("|");
document.SearchMapForm.mapsmenu.options.length = document.SearchMapForm.mapsmenu.options.length + 1;
document.SearchMapForm.mapsmenu.options[document.SearchMapForm.mapsmenu.options.length-1].value = site_ids[1];
document.SearchMapForm.mapsmenu.options[document.SearchMapForm.mapsmenu.options.length-1].text = site_ids[0];
}
}
}


</script>

<style type="text/css">

p { color:#000000;
font:arial;
font-family:arial;
font-size:small;
font-weight: normal;
margin-top:15px;
margin-bottom:15px;
}
</style>

</head>
<body önLoad="filterSite(event)">

<% ''side menu %>
<form name="SearchMapForm" id="form1" method="post" action="vibs.asp">
<input name="filterTxt" type="text" id="filterTxt" önKeyUp="filterSite(event)" size="40">


<select name="mapsmenu" size=5>
<%
MapListResults.ReQuery()
while not MapListResults.EOF
%>

<option value="<%=MapListResults("login_id")%>"><%=MapListResults("User_Name")%></option>
<%
MapListResults.MoveNext
wend
%>
</select>



< input type ="image" name ="Search" style ="color:Teal" src ="../../images/Search1.gif" alt ="Search"/>


<input type="image" name="Search" style="color:Teal" src="../../images/Search1.gif" alt="Search" />

推荐答案



代码说明:

我有一个用于输入名称的文本框,当我输入"bo"然后从数据库中填充下拉列表时,有一个下拉列表.列表框中的值是1)bob 2)bobby 3)Bone等存在于db中.现在我的要求在下面给出.

我希望名称列表框字段自动展开,以显示与名称文本框字段中输入内容的所有匹配项.例如如果我仅在名称字段中输入"bo",那么实际上只有3个名称,但除非用户实际单击下拉列表,否则仅显示第一个名称,因此他们有时会认为这是唯一匹配且不会打扰的名称点击查看是否还有其他内容.

使列表框在上述Java脚本代码中可扩展的热点.
请尽快向我提出建议

谢谢& RegaRDS
VIBS
Hi,

Code Explanation:

I have one text box for name,and one dropdown when I enter ''bo'' then dropdown filled from database.Values in listbox are 1)bob 2)bobby 3)Bony etc exists in db. Now my requirement is given below.

I want the name listbox field expand automatically to show all my matches to what has been entered in the name textbox field. e.g. If I am entering just ‘bo’ in the name field actually 3 names are there but only the first is shown unless the user actually clicks the drop-down, so they sometimes assume that that is the only name that matches and don’t bother clicking to see if there are others.

Hot to make list box expandable in above java script code.?

Pls. advice me asap

Thanks & RegaRDS
VIBS


这篇关于JavaScript中的可扩展列表框的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆