Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    New to the CF scene
    Join Date
    Dec 2006
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Need Help dynamic select menu

    Ok, here's the deal...I have two select menus, the second's options are contingent upon the selection in the first. Ok, I have this part covered.

    The second part is that the value of the selection in select#2 gets split up and dropped into two hidden inputs via an onchange event in the menu...probably best to illustrate with actual code for the second select menu in the list (suppose that the "small" option is chosen):
    Code:
    ..from head:
    <script type="text/javascript">
    
    	function updateFields(nVal){
    
    		if (nVal == ""){return}
    		var nForm = document.forms[0];
    		var info = nVal.split(",")
    		nForm['Item'].value = info[0];
    		nForm['Partno'].value = info[1];
    	}
    	
    </script>
    
    ...end head
    ...here's the form
    
    <select name="p2" size="1" id="combo_1" class="product_opt1" onchange="updateFields(this)">
    		 		<option value="">-select-</option>
                                   <option value="Parie Hoodie,4047">small</option>
    		    </select>
            <input type="hidden" name="t2"  value="d-size;small;medium;large;xlarge"> 
            <input type="hidden" name="Item" >
    	<input type="hidden" name="Partno"  >
    This code actually works, however* I need the option chosen in select2 to submit the value of "small" not "Prarie Hoodie,4047" and that's the rub.

    The function of this script is for a shopping cart (cart32) to effectively change the product name, and sku based on the product options chosen (red shirt, size: large). Cart32 has no inventory management for individual options so the solution is to create a sku for each size/color of shirt in your inventory. The problem is, how to get the form to pass this info properly.

    Its a real mess, sorry if this seems unclear, its basically a plate of spaghetti...any help or suggestions appreciated.

    Mike

  • #2
    Senior Coder
    Join Date
    Nov 2006
    Posts
    1,000
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by mthierfelder View Post
    I need the option chosen in select2 to submit the value of "small" not "Prarie Hoodie,4047" and that's the rub.
    I'm not sure I know your answer but I do have a question. What do you mean by submit? You have a form and are hitting the submit button to load a new page and want the "small" passed instead of the description? Or do you mean some other form of submit like a javascript submit?

    david_kw

  • #3
    New to the CF scene
    Join Date
    Dec 2006
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Mike,

    Thanks for pointing out that typo, I've been rehashing this script so many ways I guess I posted the non-working version..you're right it needed the ".value" there.

    I think I'm using your original script, and I really appreciate you making it available. I'd be sunk without help from guys like you. Anyway, I tried the script you provided above but it is not working yet. I think the problem is my dnaymic select boxes are getting the value, and text portions populated but I don't know how to get it to populate the class part too. Here's the javascript I use to populate the 2nd select menu (see below).

    Sorry about the long code, its a long wade through...I really appreciate any help. I'm sure its just something small but I'm missing it.

    Dynamic select boxes javascript:
    Code:
    // first combo box
    
    	data_1 = new Option("felt (brown)", "felt (brown)");
    	data_2 = new Option("midnight blue", "midnight blue");
    		
    // second combo box
     
    	data_1_1 = new Option("small", "Prarie Hoodie-4047");
    	data_1_2 = new Option("medium", "Prarie Hoodie-4048");
    		
    	data_2_1 = new Option("large", "Prarie Hoodie-4049");
    	data_2_2 = new Option("xlarge", "Prarie Hoodie-4050");
    
    // functions
    
        displaywhenempty="-select-"
        valuewhenempty=-1
    
        displaywhennotempty="-select-"
        valuewhennotempty=0
    
    
    function change(currentbox) {
    	numb = currentbox.id.split("_");
    	currentbox = numb[1];
    
        i=parseInt(currentbox)+1
    
    // I empty all combo boxes following the current one
    
        while ((eval("typeof(document.getElementById(\"combo_"+i+"\"))!='undefined'")) &&
               (document.getElementById("combo_"+i)!=null)) {
             son = document.getElementById("combo_"+i);
    	     // I empty all options except the first one (it isn't allowed)
    	     for (m=son.options.length-1;m>0;m--) son.options[m]=null;
    	     // I reset the first option
    	     son.options[0]=new Option(displaywhenempty,valuewhenempty)
    	     i=i+1
        }
    
    
    // now I create the string with the "base" name ("stringa"), ie. "data_1_0"
    // to which I'll add _0,_1,_2,_3 etc to obtain the name of the combo box to fill
    
        stringa='data'
        i=0
        while ((eval("typeof(document.getElementById(\"combo_"+i+"\"))!='undefined'")) &&
               (document.getElementById("combo_"+i)!=null)) {
               eval("stringa=stringa+'_'+document.getElementById(\"combo_"+i+"\").selectedIndex")
               if (i==currentbox) break;
               i=i+1
        }
    
    
    // filling the "son" combo (if exists)
    
        following=parseInt(currentbox)+1
    
        if ((eval("typeof(document.getElementById(\"combo_"+following+"\"))!='undefined'")) &&
           (document.getElementById("combo_"+following)!=null)) {
           son = document.getElementById("combo_"+following);
           stringa=stringa+"_"
           i=0
           while ((eval("typeof("+stringa+i+")!='undefined'")) || (i==0)) {
    
           // if there are no options, I empty the first option of the "son" combo
    	   // otherwise I put "-select-" in it
    
    	   	  if ((i==0) && eval("typeof("+stringa+"0)=='undefined'"))
    	   	      if (eval("typeof("+stringa+"1)=='undefined'"))
    	   	         eval("son.options[0]=new Option(displaywhenempty,valuewhenempty)")
    	   	      else
    	             eval("son.options[0]=new Option(displaywhennotempty,valuewhennotempty)")
    	      else
                  eval("son.options["+i+"]=new Option("+stringa+i+".text,"+stringa+i+".value)")
    	      i=i+1
    	   }
           //son.focus()
           i=1
           combostatus=''
           cstatus=stringa.split("_")
           while (cstatus[i]!=null) {
              combostatus=combostatus+cstatus[i]
              i=i+1
              }
           return combostatus;
        }
    }

    Head code:
    Code:
    <script type="text/javascript">
    
    	function updateFields(nList){
    
    		if (nList.value == ""){return}
    		var nForm = document.forms[0];
    		var info = nList[nList.selectedIndex].className.split("-")
    		nForm['Item'].value = info[0];
    		nForm['Partno'].value = info[1];
    	}
    	
    </script>
    HTML Form:
    Code:
    <form method="post" action="http://www.cart32hosting.com/cgi-bin/cart32.exe/candystore-AddItem">
    		  
    			<select name="p1" size="1" id="combo_0" class="product_opt2" onchange="change(this)">
    		 			<option value="">-select-</option>
                        <option value="felt (brown)" >felt (brown)</option>
    					<option value="midnight blue" >midnight blue</option>
    		 	</select>
            		<input type="hidden" name="t1"  value="d-color;felt (brown);midnight blue"> 
    			<select name="p2" size="1" id="combo_1" class="product_opt1" onchange="updateFields(this)">
    		 			<option value="">-select-</option>
              	</select>
            		<input type="hidden" name="t2"  value="d-size;small;medium;large;xlarge"> 
            		<input type="hidden" name="Item">
    				<input type="hidden" name="Partno" >
            		<input type="hidden" name="Price" value="168" >
           			<input type="hidden" name="Category" value="womens tops" >       		   
    				<input name="Qty" type="text" value="1" size="1" maxlength="2" class="product_qty">	   
    				<input name="submit" type="image" value="add to bag" src="/images/main_add_03.png" alt="add to bag" hspace="0" vspace="0" border="0" class="product_addtobag">
        
        </form>

  • #4
    Regular Coder
    Join Date
    Jun 2004
    Posts
    565
    Thanks
    0
    Thanked 18 Times in 18 Posts
    Another way to do what you want:
    Code:
    -- in script tag
    function updateFields(sel)
    {
    	var
    		option = sel.options[sel.selectedIndex],
    		value = option.value.split(','),
    		text = option.text;
    		
    	alert('Option text: ' + text + '\nOption value: ' + value);
    }
    
    -- in body tag
    <select name="p2" size="1" id="combo_1" class="product_opt1" onchange="updateFields(this)">
    		 		<option value="">-select-</option>
                                   <option value="Parie Hoodie,4047">small</option>
    		    </select>
    dumpfi
    "Failure is not an option. It comes bundled with the software."
    ....../)/)..(\__/).(\(\................../)_/)......
    .....(-.-).(='.'=).(-.-)................(o.O)...../<)
    ....(.).(.)("}_("}(.)(.)...............(.)_(.))Ż/.
    ŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻŻ
    Little did the bunnies suspect that one of them was a psychotic mass murderer with a 6 ft. axe.

  • #5
    New to the CF scene
    Join Date
    Dec 2006
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Yes, I agree it is complex. However, my limited understanding of js doesn't allow me to rewrite it like you can. The one thing that concerns me about your code is this: The product in question is a hooded sweatshirt, it is available in blue and brown. Blue shirts are only available in L and XL, brown in S and M. Each product option must have its own sku (4047, 4048, etc). So, the question is, with your script, does it allow for this? IE, if I choose brown will my only size options be S and M? or would I be presented with all size options there?

  • #6
    New to the CF scene
    Join Date
    Dec 2006
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I understand, my approach was confusing maybe because I myself am confused about how to approach it. In the future I will be upfront with my problems.

    I really appreciate your help with this. That being said I do have a solution that works for my needs and does what it needs to do, however unelegant it may be by your standards. Please don't bother yourself with trying to come up with more solutions, I really think I've got something here.


  •  

    Posting Permissions

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