Ho to make listbox expandable using javascript?

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • vibs
    New Member
    • Oct 2011
    • 2

    Ho to make listbox expandable using javascript?

    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.

    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>
    
    </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>
    
    </form>
    
    </body>
    </html>
    Last edited by Dormilich; Oct 12 '11, 05:37 AM. Reason: please use [CODE] [/CODE] tags when posting code
  • Dormilich
    Recognized Expert Expert
    • Aug 2008
    • 8694

    #2
    a) it’s onload not önLoad
    b) the length property of an array/list is read-only
    c) new option elements are created either via DOM (document.create Element()) or new Option()

    Comment

    Working...