SitePoint Sponsor

User Tag List

Results 1 to 9 of 9
  1. #1
    SitePoint Addict djh's Avatar
    Join Date
    Apr 2000
    Location
    Long Beach, CA
    Posts
    333
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Smart drop down menus

    Please help me...

    I'm using javascript to control two list menus, where one menu controls what's shown in the other menu.

    Can someone explain to me the concept and maybe a bit of code to get me started??

    Here's part of the code I'm using... but weird things are happening...

    Code:
    function change_Models() {
    if (document.AddProducts.brand.selectedIndex == 0) {
    document.AddProducts.model.length = 1 ;
    document.AddProducts.model.selectedIndex = 0
    document.AddProducts.model.options[0].text = ' -- select brand first -- '
    document.AddProducts.model.options[0].value = ''
    }
    if (document.AddProducts.brand.selectedIndex == 1) {
    document.AddProducts.model.length = 13;
    document.AddProducts.model.selectedIndex = 0
    document.AddProducts.model.options[1].text = '120';
    document.AddProducts.model.options[1].value = '1';
    document.AddProducts.model.options[2].text = '1100';
    document.AddProducts.model.options[2].value = '2';
    document.AddProducts.model.options[3].text = '4000';
    document.AddProducts.model.options[3].value = '3';
    document.AddProducts.model.options[4].text = '2500';
    
    .... and so on
    Thanks!!

  2. #2
    pg for mild peril cow's Avatar
    Join Date
    Mar 2000
    Location
    nevada, usa
    Posts
    636
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    can you give us a url so we can check out what's going on?
    "There's no justice like angry mob justice!" --Seymour Skinner

  3. #3
    SitePoint Addict djh's Avatar
    Join Date
    Apr 2000
    Location
    Long Beach, CA
    Posts
    333
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yeah, here's an example...

    www.e-powercell.com/demo.asp?a=1

    It's the brand and models dropdowns...
    Last edited by djh; Nov 28, 2001 at 14:55.

  4. #4
    What? Maelstrom's Avatar
    Join Date
    Oct 2001
    Location
    Whistler BC originally from Guelph Ontario
    Posts
    2,175
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You are trying to change the already existing field correct. I have done it usng 2 field so getting it to work in one field should be simple enough. ok this is a code I used for a pro bono client and I used arrays to fill the fields. I just tested changing a single field and it works well. So here is the code adjust where you like.
    Code:
    <script language="javascript">
    <!--
    var arraySelect
    var trueDescription
    var sel
    var len
    function Option(desc,value){
    //properties of array
    	this.desc=desc
    	this.value=value
    }
    var select1=new Array(6)
    select1[0] = new Option("BRAIDED","5");
    select1[1] = new Option("CLASSIC","4");
    select1[2] = new Option("CLASSIC  PQ!","200");
    select1[3] = new Option("DRAPED BUST","198");
    select1[4] = new Option("NO STEM CR 4","3");
    select1[5] = new Option("PL4 STEMLESS","199");
    var select2=new Array(18)
    select2[0] = new Option("BRAIDED","9");
    select2[1] = new Option("BRAIDED GEM!","10");
    select2[2] = new Option("BRAIDED N-3","203");
    select2[3] = new Option("BRONZE","13");
    select2[4] = new Option("CHAIN CENT","201");
    select2[5] = new Option("CORONET","7");
    select2[6] = new Option("CORONET  PQ!","8");
    select2[7] = new Option("DOUBLE DIE","15");
    select2[8] = new Option("FLOWING HAIR","6");
    select2[9] = new Option("FLYING EAGLE","11");
    select2[10] = new Option("FUGIO ST UNI","2");
    select2[11] = new Option("INDIAN","12");
    select2[12] = new Option("INDIAN   PQ!","206");
    select2[13] = new Option("INDIAN  TY 1","205");
    select2[14] = new Option("INDIAN CN","204");
    select2[15] = new Option("LINCOLN","14");
    select2[16] = new Option("POINTED RAYS","1");
    select2[17] = new Option("SM DATE N-6","202");
    
    function descriptions(deno) {
    	sel = document.addWishList.deno
    	var arraySelect=deno.value
    	var len=eval(arraySelect+".length")
    	for (var x=0;x<len;x++){
    		sel.length=len+2
    		sel.options[0].text="Any"
    		sel.options[0].value=0
    		sel.options[x+1].value=(eval(arraySelect+"["+x+"].value"))
    		sel.options[x+1].text=(eval(arraySelect+"["+x+"].desc"))
    		sel.options[len+1].text="None"
    		sel.options[len+1].value=1
    		}
    }
    //-->
    </script>
    This was obviosly written with a multi dimentional array in mind. I have two fields by default. If you want to use both you will have to change the line
    Code:
    sel = document.addWishList.deno
    to whatever field you wish to change in this case it changes itself. But this is the way it was
    Code:
    sel = document.addWishList.des
    And this is the part the goes in your body

    Code:
    <form name="addWishList" method="post" action="">
    <select name="deno" id="deno" onchange="descriptions(deno)">
    			<option value="select0">Any</option>		
    		
    			<option value="select1">Large/Small Cent</option>
    			
    			<option value="select2">Half Cent</option>
    		
    	</select>
    <select name="des" id="des" onchange="alert(this.value)">
    	<option value="0">Any</option>
    	<option value="1">None</option>
    </select>
    </form>
    </body>
    I am sure you can see where the code names are and stuff so I won't go into a tonne of detail. The field names are des and deno and those names are used above. If you need any help just ask again. If this wasn't what you needed. Well I will try again
    Maelstrom Personal - Apparition Visions
    Development - PhP || Mysql || Zend || Devshed
    Unix - FreeBSD || FreeBsdForums || Man Pages
    They made me a sitepoint Mentor - Feel free to PM me or Email me and I will see if I can help.

  5. #5
    What? Maelstrom's Avatar
    Join Date
    Oct 2001
    Location
    Whistler BC originally from Guelph Ontario
    Posts
    2,175
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ok so you are trying to change a second field. Ok The above code works well for that. If you need any explanations just ask
    Maelstrom Personal - Apparition Visions
    Development - PhP || Mysql || Zend || Devshed
    Unix - FreeBSD || FreeBsdForums || Man Pages
    They made me a sitepoint Mentor - Feel free to PM me or Email me and I will see if I can help.

  6. #6
    SitePoint Addict djh's Avatar
    Join Date
    Apr 2000
    Location
    Long Beach, CA
    Posts
    333
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks Maelstrom...

    I'll try it. Thank you so much...

    -Dave

  7. #7
    What? Maelstrom's Avatar
    Join Date
    Oct 2001
    Location
    Whistler BC originally from Guelph Ontario
    Posts
    2,175
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    My pleasure
    Maelstrom Personal - Apparition Visions
    Development - PhP || Mysql || Zend || Devshed
    Unix - FreeBSD || FreeBsdForums || Man Pages
    They made me a sitepoint Mentor - Feel free to PM me or Email me and I will see if I can help.

  8. #8
    SitePoint Addict djh's Avatar
    Join Date
    Apr 2000
    Location
    Long Beach, CA
    Posts
    333
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hmmm...

    I tried the code and I keep getting an error.

    "Expected ; on line 104"

    But I've changed it on line 104... Very strange.

    I'm obviously doing something wrong.

    Any ideas?

  9. #9
    What? Maelstrom's Avatar
    Join Date
    Oct 2001
    Location
    Whistler BC originally from Guelph Ontario
    Posts
    2,175
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Code:
    <html>
    <head>
    <title>Untitled Document</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <script language="javascript1.2">
    <!--
    var arraySelect
    var trueDescription
    var sel
    var len
    function Option(desc,value){
    //properties of array
    	this.desc=desc
    	this.value=value
    }
    var select1=new Array(6)
    select1[0] = new Option("BRAIDED","5");
    select1[1] = new Option("CLASSIC","4");
    select1[2] = new Option("CLASSIC  PQ!","200");
    select1[3] = new Option("DRAPED BUST","198");
    select1[4] = new Option("NO STEM CR 4","3");
    select1[5] = new Option("PL4 STEMLESS","199");
    var select2=new Array(18)
    select2[0] = new Option("BRAIDED","9");
    select2[1] = new Option("BRAIDED GEM!","10");
    select2[2] = new Option("BRAIDED N-3","203");
    select2[3] = new Option("BRONZE","13");
    select2[4] = new Option("CHAIN CENT","201");
    select2[5] = new Option("CORONET","7");
    select2[6] = new Option("CORONET  PQ!","8");
    select2[7] = new Option("DOUBLE DIE","15");
    select2[8] = new Option("FLOWING HAIR","6");
    select2[9] = new Option("FLYING EAGLE","11");
    select2[10] = new Option("FUGIO ST UNI","2");
    select2[11] = new Option("INDIAN","12");
    select2[12] = new Option("INDIAN   PQ!","206");
    select2[13] = new Option("INDIAN  TY 1","205");
    select2[14] = new Option("INDIAN CN","204");
    select2[15] = new Option("LINCOLN","14");
    select2[16] = new Option("POINTED RAYS","1");
    select2[17] = new Option("SM DATE N-6","202");
    
    function descriptions(deno) {
    	sel = document.addWishList.des
    	var arraySelect=deno.value
    	var len=eval(arraySelect+".length")
    	for (var x=0;x<len;x++){
    		sel.length=len+2
    		sel.options[0].text="Any"
    		sel.options[0].value=0
    		sel.options[x+1].value=(eval(arraySelect+"["+x+"].value"))
    		sel.options[x+1].text=(eval(arraySelect+"["+x+"].desc"))
    		sel.options[len+1].text="None"
    		sel.options[len+1].value=1
    		}
    }
    //-->
    </script>
    </head>
    
    <body bgcolor="#FFFFFF" text="#000000">
    <form name="addWishList" method="post" action="">
    <select name="deno" id="deno" onchange="descriptions(deno)">
    			<option value="select0">Any</option>		
    		
    			<option value="select1">Large/Small Cent</option>
    			
    			<option value="select2">Half Cent</option>
    		
    	</select>
    <select name="des" id="des" onchange="alert(this.value)">
    	<option value="0">Any</option>
    	<option value="1">None</option>
    </select>
    </form>
    </body>
    </html>
    There is the code exactly. It works as is. The funny thing is there is even 100 lines of code in what I gave you. I would say you mistyped something or another part of the code is off. Copy that code and run it as is and if it works, work it into you system. If you keep getting errors then you have more than likely got a syntax error somewhere.
    Maelstrom Personal - Apparition Visions
    Development - PhP || Mysql || Zend || Devshed
    Unix - FreeBSD || FreeBsdForums || Man Pages
    They made me a sitepoint Mentor - Feel free to PM me or Email me and I will see if I can help.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •