Full version: jsB@nk » Form » Dropdown » DataBaseSel
URL: https://www.javascriptbank.com/datbassel.html
A method to load multiple dropdowns from previous selections. The number of dropdowns can be easily changed needed. The concept is to get filler data from a database for the next dropdown. Although the data in the example doesn't change with the selection, the application will load appropriate values from the database into the dropdown menus. The retrieval of data is simulated here; it is up to the user to retrieve the data and load into the data Array.
Full version: jsB@nk » Form » Dropdown » DataBaseSel
URL: https://www.javascriptbank.com/datbassel.html
<script language="javascript"><!-- Original Programmed by Ira Sterbakov - irasterb@erols.com 1/8/05 --><!-- PLease keep credit in JavaScript section --><!-- May be freely used and modified - email notification would be nice -->var aDr= new Array()function SelDat(n){//n is the pointer to the next select list//get Data placed in aDr from databaseGetDat(n);// now that you have data, load the select list pointed to by nvar NewListad2 = eval('document.mess.us' + n);NewListad2.options.length = 0;for ( i1 = 0; i1 < aDr.length; i1++ ){NewListad2.options[i1] = new Option(aDr[i1].Description,aDr[i1].Id);}}function GetDat(ip){//THIS IS A SIMULATION OF PLACING THE DATA INTO THE aDr ARRAY// ip is the pointer to the chain, in this case 2 to get groups and 3 for names // get the value of the changed select list.var io = ip -1;var NewListad = eval('document.mess.us' + io);var VName = NewListad.value;// you get the DATA from VName and place in aDrdocument.getElementById('d' + ip).innerHTML = '<b>Came from ' + VName + '</b>';aDr.length = 0;var kk = new Array()kk = (ip==3) ? aNr : aGr;for ( ii = 0; ii < kk.length; ii++ ){aDr[ii] = kk[ii];}}//simulated results for category listvar aCr = new Array();aCr[0] = new Set2val('Cat0','category0');aCr[1] = new Set2val('Cat1','category1');aCr[2] = new Set2val('Cat2','category2');aCr[3] = new Set2val('Cat3','category3');// simulated results for group listvar aGr = new Array();aGr[0] = new Set2val('Gro0','Group0');aGr[1] = new Set2val('Gro1','Group1');aGr[2] = new Set2val('Gro2','Group2');aGr[3] = new Set2val('Gro3','Group3');aGr[4] = new Set2val('Gro4','Group4');aGr[5] = new Set2val('Gro5','Group5');//continue// simulated results for name listvar aNr = new Array();aNr[0] = new Set2val('Nam0','Name0');aNr[1] = new Set2val('Nam1','Name1');aNr[2] = new Set2val('Nam2','Name2');aNr[3] = new Set2val('Nam3','Name3');aNr[4] = new Set2val('Nam4','Name4');aNr[5] = new Set2val('Nam5','Name5');aNr[6] = new Set2val('Nam6','Name6');aNr[7] = new Set2val('Nam7','Name7');aNr[8] = new Set2val('Nam8','Name8');aNr[9] = new Set2val('Nam9','Name9');//continue//Id and Description can be same valuefunction Set2val(V1,V2){this.Id = V1;this.Description = V2;} // set categories into first dropdown from aCr here var NewListad0 = document.mess.us1;NewListad0.options.length = 0;for ( i1 = 0; i1 < aCr.length; i1++ ){NewListad0.options[i1] = new Option(aCr[i1].Description,aCr[i1].Id);}</script><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com--><form name="mess"> <table cellpadding="4" border="0"> <tbody><tr> <td> <p><b>Category</b></p> </td> <td> <p><b><select style="" name="us1" onchange="SelDat(2)"><option value="Cat0">category0</option><option value="Cat1">category1</option><option value="Cat2">category2</option><option value="Cat3">category3</option></select></b></p> </td> </tr> <tr> <td> <p><b>Group</b></p> </td> <td> <p><select style="" name="us2" onchange="SelDat(3)"><option value="0" selected="selected">- None selected - </option></select></p> </td> <td> <div id="d2"> </div> </td> </tr> <tr> <td> <p><b>Name</b></p> </td> <td> <p><select name="us3" style=""><option value="0" selected="selected">- None selected - </option></select></p> </td> <td> <div id="d3"> </div> </td> </tr> </tbody></table> </form><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->