Dynamically populated dropdown menus

ASP Forum

Dynamically populated dropdown menus
bigmista | Posted 1:20pm 25. July 2001 Server Time |

I have an asp question if you aren't too busy. I have a file that has 4 dropdown menus (Area, Cabin, Shelf, Position). All are populated from the database. What is for the selections in the Cabin dropdown to be limited by the User selection in the Area dropdown, the shelf to be limited by the cabin and the position to be limited by the shelf. The problem is this has to be done in realtime, preferably on the same page, when the user makes the selection. Seeing as how you can't mix JavaScript and ASP (you can't, can you?) I can't figure this one out. Do you have any suggesstions?

jimlaDD | Posted 6:34am 26. July 2001 Server Time |

the javascript in za head :
<head>

<script language="Javascript">

function searchi()
{
document.frmtest.action="nameofthispage.asp";
document.frmtest.target="_self";
document.frmtest.submit();

}
</script>
</head>
<body>
<%
'to distinguish between different values being passed from different sources to this page :

if flag = 1 then
roomname = "TrainingRoom"
datee = date()

elseif flag = 2 then
roomname = request.querystring("roomname")
datee = request.form("date1")

else
roomname = request.form("roomname")
datee = request.form("date1")

end if

'my dropdown menu :

<select name="roomname" onChange="searchi()" class="select">
                        <option selected><%=roomname%> </option>
                        <% SQLstmt ="SELECT * from room WHERE not roomname = '" & roomname & "' ORDER BY room.roomname"
Set rs = conn.Execute(SQLstmt) %>
                        <% while not rs.eof

%>
                        <option value="<%=rs("roomname")%>"><%=rs("roomname")%></option>
                        <% rs.movenext

wend

rs.close%>
                      </select>

' in your example you could pass the area dropdown variable back into this page, store it in a variable, then do
areavar = request.form("areavar")

%>

<select name="cabin" onChange="searchi()" class="select">
                        <option selected><%=cabin%> </option>
                        <% SQLstmt ="SELECT * from cabin where cabinsize<='" & areavar & "'"
Set rs = conn.Execute(SQLstmt) %>
                        <% while not rs.eof

%>
                        <option value="<%=rs("cabinsize")%>"><%=rs("cabinsize")%></option>
                        <% rs.movenext

wend

rs.close%>
                      </select>

hope you understanD that ...

cheers,
jim

bigmista | Posted 2:16pm 26. July 2001 Server Time |

Jim,

Thanks for responding so quickly! I appreciate it! I don't understand the JavaScript section and the section with the flags in it. I'm also not sure how to pass the selected value from the 'Area' dropdown thru the onChange and JavaScript to the SQL statement in ASP. I hope my question is clear. Thanks again!

Bigmista

jimlaDD | Posted 6:16am 27. July 2001 Server Time |

The javascript is called when you click on a value in the dropdown list.
When it is called it posts the form that the dropdown is residing in (here called frmtest) to the page you specify in : document.frmtest.action="nameofthispage.asp";

With this problem you want the form to be posted to the same page, thereby sending your chosen value into a variable as the page refreshes.
Here I will add (because it will be easier to translate) that you send the variable 'flag' to the page in the javascript like dis --> document.frmtest.action="nameofthispage.asp?flag=1";

Now, this is where the if statements come in assuming that your cabin dropdown name is 'cabinval' we'll call the new variable 'cabinval' too:
<%
if flag = 1 then
cabinval= request.form("cabinval")
end if
%>
(I use flags so that if you connect to the page from your homepage and want different values to be displayed in your dropdowns then you can use different flags to make the variables different values by passing different flag values...........pheW)
er...

This is to limit the selection from the area table based upon the cabin value (for your select statement):
<%
if cabinval <=25 then
areaval =100
end if
%>

Now, to show values in your area dropdown limited by your cabin selection you can do:

<select name="area" onChange="searchi()" class="select">

<% SQLstmt ="SELECT area from area where area<='" & areaval & "'"
Set rs = conn.Execute(SQLstmt) %>
<% while not rs.eof
%>
<option value="<%=rs("area")%>"></option>
<% rs.movenext
wend
rs.close%>
</select>

hOpe that wOrks for ya

bbcompent1 | Posted 12:59am 14. August 2002 Server Time |

Ok, I used what you have above. It does populate the first field but then the page refreshes with no information in it. Here is my source code. What am I doing wrong? How do I store the variable in a value that I can call?

<%@ LANGUAGE=VBScript%>



<%

Dim adoCon, sid
Set adoCon = CreateCon
sid = GetSid

%>

<html>
<head>
<title>New Tech Tip</title>
<script language="Javascript">
function searchi()
{
document.frmtest.action="newtest.asp";
document.frmtest.target="_self";
document.frmtest.submit();
}
</script>
</head>
<%
'The drop down menu
%>
<select name="category" onChange="searchi()" class="select">
<Option selected><%=category%></option>
<%
sqlStmt="Select cname from categories ORDER BY cname"
set rs = adoCon.Execute(sqlStmt)

while not rs.eof
%>

<%
%>
<option value="<%=rs("cname")%>"><%=rs("cname")%></option>
<%
rs.movenext
wend
rs.close
%>
</select>
<P>
<%
set category= Request.Form("category")
%>
<select name="version" onChange="searchi()" class="select">
<Option selected><%=version%></option>
<%
sqlStmt="Select cname from cat_version where cat_version.category_id = '" & category & "' ORDER BY cname"
set rs = adoCon.Execute(sqlStmt)

while not rs.eof
%>
<option value="<%=rs("cname")%>"><%=rs("cname")%></option>
<%
rs.movenext
wend
rs.close
%>
</select>

bbcompent1 | Posted 1:44pm 17. December 2007 Server Time |

Ok, I have a wierd situation.  The query in my case won't work.  I'll only post the necessary bits of info.  Form name is pets.  When I let the entire breed list populate, all works fine.  WHen I try using the jsfunction by choosing the pet type being cat or dog, I get 'object doesn't support this property or method'.

<head>
<script language="Javascript">

function searchi()
{
document.pets.action="addpet.asp";
document.pets.target="_self";
document.pets.submit();
}

</script>
</head>

<form method="post" name="pets" action="postnewpet.asp">
  <tr>
  <%   pettype=request.form("pettype")   %>
    <td>Animal Type</td>
        <td><select name="pettype" onChange="searchi()">
    <option selected>Choose Cat or Dog</option>
            <option value="<%=pettype%>"><%=pettype%></option>
            <option value="cat">cat</option>
            <option value="dog">dog</option>
            </select>
</td>
  </tr>
  <tr>
<td>Breed</td>
<td>
<select name="select">
<%
SQLstmt ="SELECT * from breeds where breedtype like '" & pettype & "';"
Set rsBreed = server.CreateObject("ADODB.Recordset")
rsBreed.open SQLstmt, MyConn, 3, 3
while not rsBreed.eof
%>
<option value="<%=rsBreed.fields(2)%>"><%=rsBreed.Fields(2)%></option>
<%
rsBreed.movenext
wend
rsBreed.close
%>
</select></td>

Reply to Post Dynamically populated dropdown menus

Back to Forum Page