Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people, just like you, are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
Solved

Lists & Combos

Posted on 2000-05-08
2
163 Views
Last Modified: 2013-12-25
Is there a way to filter a combo list based on the selection of another combo list without revisting the server and that works in both IE 4+ and Netscape 4+?



0
Comment
Question by:mshire
2 Comments
 
LVL 8

Accepted Solution

by:
xabi earned 100 total points
ID: 2795707
Here goes an example:

--------- 8< --------- 8< ----------
<html>
<head>
<title>Example</title>
<script language="javascript">
<!--
var aOptions = new Array()
aOptions["1_"]     = "Fruit"
aOptions["1_1_"]   = "Fruit Orange"
aOptions["1_2_"]   = "Fruit Apple"
aOptions["1_1_1_"] = "Fruit Orange Good"
aOptions["1_1_2_"] = "Fruit Orange Bad"
aOptions["1_2_1_"] = "Fruit Apple Green"
aOptions["1_2_2_"] = "Fruit Apple Red"
aOptions["1_2_3_"] = "Fruit Apple Yellow"

aOptions["2_"]     = "Color"
aOptions["2_1_"]   = "Color Red"
aOptions["2_2_"]   = "Color Blue"
aOptions["3_3_"]   = "Color Green"
aOptions["2_1_1_"] = "Color Red Dark"
aOptions["2_1_2_"] = "Color Red Light"
aOptions["2_2_1_"] = "Color Blue Dark"
aOptions["2_2_2_"] = "Color Blue Light"
aOptions["2_3_1_"] = "Color Green Dark"
aOptions["2_3_2_"] = "Color Green Light"

aOptions["3_"]     = "Number"
aOptions["3_1_"]   = "Number Big"
aOptions["3_2_"]   = "Number Small"
aOptions["3_1_1_"] = "Number Big 1000"
aOptions["3_1_2_"] = "Number Big 2000"
aOptions["3_1_3_"] = "Number Big 3000"
aOptions["3_2_1_"] = "Number Small 2"
aOptions["3_2_2_"] = "Number Small 5"
aOptions["3_2_3_"] = "Number Small 9"

function level(sTmp) {
 iTmp = 0
 for (i=0; i<sTmp.length; i++) {
  if (sTmp.charAt(i) == "_") iTmp++
 }
 return iTmp
}

function redo_level3() {
 idselect = document.myform.myselect3
 idselect.length = 0
 if (document.myform.myselect2.selectedIndex != -1) {
  sTmp = document.myform.myselect2.options[document.myform.myselect2.selectedIndex].value
 } else {
  if (document.myform.myselect1.selectedIndex != -1) {
   sTmp = document.myform.myselect1.options[document.myform.myselect1.selectedIndex].value
  } else {
   sTmp = ""
  }
 }
 for (sName in aOptions) {
  if ((level(sName) == 3) && (sName.substr(0,sTmp.length) == sTmp)) {
   idselect.length++
   idselect.options[idselect.length-1].value = sName
   idselect.options[idselect.length-1].text  = aOptions[sName]
  }
 }
}

function redo_level2() {
 idselect = document.myform.myselect2
 idselect.length = 0
 if (document.myform.myselect1.selectedIndex != -1) {
  sTmp = document.myform.myselect1.options[document.myform.myselect1.selectedIndex].value
 } else {
  sTmp = ""
 }
 for (sName in aOptions) {
  if ((level(sName) == 2) && (sName.substr(0,sTmp.length) == sTmp)) {
   idselect.length++
   idselect.options[idselect.length-1].value = sName
   idselect.options[idselect.length-1].text  = aOptions[sName]
  }
 }
 redo_level3()
}

function redo_level1() {
 idselect = document.myform.myselect1
 idselect.length = 0
 for (sName in aOptions) {
  if (level(sName) == 1) {
   idselect.length++
   idselect.options[idselect.length-1].value = sName
   idselect.options[idselect.length-1].text  = aOptions[sName]
  }
 }
 redo_level2()
}

//-->
</script>
</head>
<body onload="redo_level1()">
 <form name="myform">
  <select name="myselect1" size="4" onchange="redo_level2()">
  <option>--------------------------------------------------------------</option>
  </select>
  <br><br>
  <select name="myselect2" size="4" onchange="redo_level3()">
  <option>--------------------------------------------------------------</option>
  </select>
  <br><br>
  <select name="myselect3" size="4">
  <option>--------------------------------------------------------------</option>
  </select>
 </form>
</body>
</html>
---------- 8< ----------- 8< ---------

If you need more info just ask.

xabi
0
 

Author Comment

by:mshire
ID: 2799736
With a little alteration, I managed to get it to work the way I wanted... I've just got to try it out on Netscape. Thanks.
0

Featured Post

Master Your Team's Linux and Cloud Stack!

The average business loses $13.5M per year to ineffective training (per 1,000 employees). Keep ahead of the competition and combine in-person quality with online cost and flexibility by training with Linux Academy.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

An enjoyable and seamless user experience can go a long way on an eCommerce site. While a cohesive layout and engaging copy play roles in creating a positive user experience, some sites neglect aspects that seem marginal but in actuality prove very …
Color can increase conversions, create feelings of warmth or even incite people to get behind a cause. If you want your website to really impact site visitors, then it is vital to consider the impact color has on them.
This tutorial demonstrates how to identify and create boundary or building outlines in Google Maps. In this example, I outline the boundaries of an enclosed skatepark within a community park.  Login to your Google Account, then  Google for "Google M…
The viewer will learn how to dynamically set the form action using jQuery.

790 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question