Skip to main content
Inspiring
August 20, 2015
Question

dynamic drop down menus

  • August 20, 2015
  • 0 replies
  • 335 views

Hi everyone. I am trying to create some drop down menus where if you do a selection in the first drop down menu, the second drop down menu will display. I have this working on 2 drop down menus,but the problem I'm having is if I choose something out of the first drop down menu and then change my mind and want to choose something else, the page goes blank. If I change it to something else in the first drop down, it should display all the results in drop down 2 according to what I chose in drop down 1. It does do this the first time if I choose the correct thing the first time, but if I try to change drop down 1, the page goes blank. What am I doing wrong? Here's the code I have:

<!--- store the selected Main_Group variable variable after the first select boxes submits itself --->

<cfif NOT isDefined("form.submit")>

  <cfif isDefined('form.select_PinCount') AND form.select_PinCount NEQ "">

  <cfset page.select_PinCount = form.select_PinCount>

  </cfif>

   

    <cfif isDefined('form.select_BodySize') AND form.select_BodySize NEQ "">

  <cfset page.select_BodySize = form.select_BodySize>

  </cfif>

<cfoutput>

  <form method="post" action="email_code_test9.cfm">

  <!--- query DB for the first drop down list ---> 

  <cfquery name="get_PinCount" datasource="#application.datasource#">     

  SELECT DISTINCT Pin_Count

  FROM BGA

  ORDER BY Pin_Count

  </cfquery>

  <!--- first drop down list ---> 

  <!--- NOTICE the onChange javascript event in the select tag, this is what submits the form after the first selection --->

  <select name="select_PinCount" required="yes" onchange="this.form.submit()">

  <option value="">Select Pin Count</option>     

  <!--- dynamically populate the first drop down list based on the get_PinCount query --->

  <!--- NOTICE the CFIF within the option tag, this says, if the first selection has been made, display the chosen option when the page reloads --->

  <cfloop query="get_PinCount">          

  <option value="#Pin_Count#" <cfif isDefined('form.select_PinCount')><cfif form.select_PinCount eq Pin_Count>selected</cfif></cfif>>#Pin_Count#</option>     

  </cfloop> 

  </select>

  <br><br>

   

  <!--- if the first selection has been made, display the second drop down list with the appropriate results --->

  <cfif isDefined('page.select_PinCount')>

  <!--- query DB for second drop down list, based on the selected item from the first list --->

  <cfquery name="get_BodySize" datasource="#application.datasource#">         

  SELECT DISTINCT Body_Size_mm

  FROM BGA

  WHERE Pin_Count = #select_PinCount#

  ORDER BY Body_Size_mm

  </cfquery>

  <!--- second drop down list --->

  <select name="select_BodySize" required="yes" onchange="this.form.submit()">

  <option value="">Select Body Size</option>

  <!--- dynamically populate the second drop down list based on the get_BodySize query --->

  <cfloop query="get_BodySize">          

  <option value="#Body_Size_mm#" <cfif isDefined('form.select_BodySize')><cfif form.select_BodySize eq Body_Size_mm>selected</cfif></cfif>>#Body_Size_mm#</option>     

  </cfloop>

  </select>

<input type="Hidden" name="Submit" value="Submit">

  </cfif>

  <br><br>

  </form>

</cfoutput>

</cfif>

The link to this is here: https://www.ironwoodelectronics.com/catalog/Package_Specs/email_code_test9.cfm

Thanks.

Andy

This topic has been closed for replies.