ODBiC Discussion Board


Need to do cascade dropdown with 3 levels

by JULIO HERRERA
August 30, 2002 17:48

I HAVE TRY TO DO THAT WITH JAVA AND ARRAYS BUT I HAVE SO MANY COLUMNS AND THE JAVASCRIPT TAKES SO LONG TO REFRESH, IF ANYBODY HAVE A BETTER SOLUTION PLEASE HELP ME, I ATTACH THE SAMPLE

<!--DATABASE DSN=DEV; UID=INTRANET; PWD=INTRANET --> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>Untitled Document</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<HEAD>

<SCRIPT LANGUAGE="JavaScript">

<!-- This script and many more are available free online at --> <!-- The JavaScript Source!! http://javascript.internet.com --> <!-- Original: Andrew Berry (aberry@berrysystems.com) --> <!-- Web Site: http://www.berrysystems.com -->

<!-- Begin var arrItems1 = new Array(); var arrItemsGrp1 = new Array();

<!--SELECT * FROM GENERAL.DEPARTAMENTOS@DB_SERVER WHERE COD_EMPRESA = 1 --> $SQL_ERROR$ <!--EACHROW--> arrItems1[$EVAL(($COD_EMPRESA$*1000000)+($COD_DIVISION$*10000)+($COD_DEPTO$*100))] = "$NOM_DEPTO$"; arrItemsGrp1[$EVAL(($COD_EMPRESA$*1000000)+($COD_DIVISION$*10000)+($COD_DEPTO$*100))] = $EVAL(($COD_EMPRESA$*1000000)+$COD_DIVISION$*10000) <!--ENDROW--> arrItems1[3] = "Truck"; arrItemsGrp1[3] = 1; arrItems1[4] = "Train"; arrItemsGrp1[4] = 1; arrItems1[5] = "Car"; arrItemsGrp1[5] = 1;

arrItems1[6] = "Boat"; arrItemsGrp1[6] = 2; arrItems1[7] = "Submarine"; arrItemsGrp1[7] = 2;

arrItems1[0] = "Planes"; arrItemsGrp1[0] = 3; arrItems1[1] = "Ultralight"; arrItemsGrp1[1] = 3; arrItems1[2] = "Glider"; arrItemsGrp1[2] = 3;

var arrItems2 = new Array(); var arrItemsGrp2 = new Array();

arrItems2[21] = "747"; arrItemsGrp2[21] = 0 arrItems2[22] = "Cessna"; arrItemsGrp2[22] = 0

arrItems2[31] = "Kolb Flyer"; arrItemsGrp2[31] = 1 arrItems2[34] = "Kitfox"; arrItemsGrp2[34] = 1

arrItems2[35] = "Schwietzer Glider"; arrItemsGrp2[35] = 2

arrItems2[99] = "Chevy Malibu"; arrItemsGrp2[99] = 5 arrItems2[100] = "Lincoln LS"; arrItemsGrp2[100] = 5 arrItems2[57] = "BMW Z3"; arrItemsGrp2[57] = 5

arrItems2[101] = "F-150"; arrItemsGrp2[101] = 3 arrItems2[102] = "Tahoe"; arrItemsGrp2[102] = 3

arrItems2[103] = "Freight Train"; arrItemsGrp2[103] = 4 arrItems2[104] = "Passenger Train"; arrItemsGrp2[104] = 4

arrItems2[105] = "Oil Tanker"; arrItemsGrp2[105] = 6 arrItems2[106] = "Fishing Boat"; arrItemsGrp2[106] = 6

arrItems2[200] = "Los Angelas Class"; arrItemsGrp2[200] = 7 arrItems2[201] = "Kilo Class"; arrItemsGrp2[201] = 7 arrItems2[203] = "Seawolf Class"; arrItemsGrp2[203] = 7

function selectChange(control, controlToPopulate, ItemArray, GroupArray)

var myEle ; var x ; // Empty the second drop down box of any choices for (var q=controlToPopulate.options.length;q>=0;q--) controlToPopulate.options[q]=null; if (control.name == "firstChoice") { // Empty the third drop down box of any choices for (var q=myChoices.thirdChoice.options.length;q>=0;q--) myChoices.thirdChoice.options[q] = null;

// ADD Default Choice - in case there are no values myEle = document.createElement("option") ; myEle.value = 0 ; myEle.text = "[SELECT]$FIRSTCHOICE$" ; controlToPopulate.add(myEle) ; // Now loop through the array of individual items // Any containing the same child id are added to // the second dropdown box for ( x = 0 ; x < ItemArray.length ; x++ )

if ( GroupArray[x] == control.value )

myEle = document.createElement("option") ; myEle.value = x ; myEle.text = ItemArray[x] ; controlToPopulate.add(myEle) ;

}

// End --> </script>

</HEAD>

<!-- STEP TWO: Copy this code into the BODY of your HTML document -->

<BODY> <!--SHOWINPUT--> <form name=myChoices> <table align="center"> <tr> <td> <!--SELECT * FROM GENERAL.DIVISIONES@DB_SERVER WHERE DIVISIONES.COD_EMPRESA = 1 AND DIVISIONES.NOM_DIVISION NOT LIKE '.'--> <SELECT id=firstChoice name=firstChoice onchange="selectChange(this, myChoices.secondChoice, arrItems1, arrItemsGrp1);"> <option value=0 SELECTED>[SELECT]</option>

<!--EACHROW--> <option value=$EVAL(($COD_EMPRESA$*1000000)+$COD_DIVISION$*10000)>$NOM_DIVISION$</option> <!--ENDROW--> </SELECT> </TD><TD> <SELECT id=secondChoice name=secondChoice onchange="selectChange(this, myChoices.thirdChoice, arrItems2, arrItemsGrp2);"> </SELECT> <SELECT id=thirdChoice name=thirdChoice> </SELECT> </TD> </TR> </TABLE> <p> <input type="submit" name="Submit" value="Submit"> </p> </form>

</html>


Replies:


Post Your Reply:

Name   
E-mail  optional
Topic  
Message:

HTTP Link: 
Link text: 


Copyright ©1997, Roger Harris. All rights reserved.