Phiên bản đầy đủ: jsB@nk » Biểu mẫu » Trình đơn xổ dọc » Hộp chọn động
URL: https://www.javascriptbank.com/datbassel.html
Hiệu ứng sẽ làm cho các menu kế tiếp nhau tự động thay đổi giá trị khi các menu trước chúng đã được chọn.
Phiên bản đầy đủ: jsB@nk » Biểu mẫu » Trình đơn xổ dọc » Hộp chọn động
URL: https://www.javascriptbank.com/datbassel.html
<script language="javascript"><!-- Original Programmed by Ira Sterbakov - [email protected] 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-->