help with jump menu

shawntbanks · Oct 31, 2003

I want to be able to select on of the vehicles from the drop down menu and have it go to a new page where you can enter information about that vehicle.

<cfquery datasource="market" name="getvehicles">
select subcategory as vehicletype
, count(*) as vehicles
from adds
where subcategoryid in
( 1 -- cars
, 2 -- trucks & Vans
, 3 -- Boats & Watercraft
, 4 -- Motorcycles
, 5 -- RV's
, 6 -- SUV's
, 7 -- Snowmobiles
, 8 -- Auto Accessories
, 9 -- Farm Equipment
, 10 -- Heavy Equipment
, 11 -- Other
)
group by subcategory
order by subcategory
</cfquery>
<cfset totalvehicles
= ArraySum(ListToArray(
ValueList(getvehicles.vehicles)))>

<body>
<form><tr valign="top"><td><p><strong>Vehicles:
(<cfoutput>#totalvehicles#</cfoutput>
listings)</strong></p></td></tr>
<tr><td><select name="Vehicles" size="1">
<option>--- Choose One ---</option>
<cfoutput query="getvehicles">
<option>#getvehicles.vehicletype#
(#getvehicles.vehicles# listings)</option> </cfoutput></select></form>

csteinhilber · Oct 31, 2003

The easiest way is to have the value of the option be the URL you want to go to:

Code:

<cfoutput query=&quot;getvehicles&quot;>
<option value=&quot;enterinformation.cfm?vehicle=#getvehicles.vehicletype#&quot;>#getvehicles.vehicletype#
  (#getvehicles.vehicles# listings)</option>
</cfoutput>

then assign a javascript function to the select's onchange event

Code:

  <form name=&quot;jumpform&quot; ...
     :
  <select name=&quot;Vehicles&quot; size=&quot;1&quot; onChange=&quot;javascript:goJump()&quot;>

where goJump would be a function like:

Code:

  function goJump(){
    var dropdown = document.forms[&quot;jumpform&quot;].elements[&quot;Vehicle&quot;];
    var URL = dropdown.options[dropdown.selectedIndex].value;
    window.location.href = URL;
    return true;  
  }

-Carl

csteinhilber · Oct 31, 2003

Sorry... that would, of course, be:

Code:

  function goJump(){
    var dropdown = document.forms[&quot;jumpform&quot;].elements[&quot;Vehicle

Code:

s

Code:

&quot;];
       :

-Carl

r937 · Oct 31, 2003

shawn, nice query, man, where'd you get it

and what about those fabulous nested ArraySum, ListToArray, ValueList functions, eh?

but shawn, stop already with the <tr><td> without the <table> tag! have some respect for properly formed html and you will go far

that said, you should also not rely on the onchange javascript event

unless this form is for your own personal use as the administrator of the vehicles site, be aware that a lot of people may have javascript turned off

jump menus just sit there for those people

rudy

csteinhilber · Nov 3, 2003

Right chu are on all counts, Rudy.

Standard fallback is simply to provide a submit button (with a caption of "Go" usually suffices), and designate the action of the form to be a .cfm page that simply takes the value of FORM.Vehicles and does a CFLOCATION or META refresh to that URL.

If the user has javascript turned on, the user need only select the item from the select box, the goJump() function is called and the user is on their way.

If the user has javascript turned off, the user has the extra step of clicking on the Go button after they've selected the item in the select box... but the actual functionality of taking the user to the desired page isn't broken.

-Carl

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

help with jump menu

shawntbanks

Programmer

csteinhilber

Programmer

csteinhilber

Programmer

r937

Technical User

csteinhilber

Programmer

Similar threads

Part and Inventory Search

Sponsor