Quick Question. Hope someone can help

slipondajimmy · 07-06-2008, 04:10 PM

Hey Everyone.

I need to know how in the world I can make it so the 3-6, 6-12, and 12-18 options will only show that white is available. Every other size except these are available in the other colors.

Code:

<td><select name="os1" class="cnt" id="size">
                                            <option>3-6mo</option>
					    <option>6-12mo</option>
					    <option>12-18mo</option>
					    <option>2T</option>
					    <option>3T</option>
					    <option>4T</option>
					    <option>XS</option>
				            <option>S</option>
					 </select>
					 <select name="os0" class="cnt" id="select">
                                                 <option selected>White</option>
                                            <option>Red</option>
                                            <option>Gray</option>
         			 </select>
          <input name="on0" type="hidden" id="on02" value="color" />
		  <input name="on1" type="hidden" id="on12" value="size" />
          <input name="quantity" type="text" id="quantity2" value="1" size="3" maxlength="5" /></td>
                                        </tr>
                                    </table></td>

**Eric** · 07-06-2008, 04:33 PM

Not the best, but it works.

PHP Code:

  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>

 
<head>

    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />

    <title>Untitled 1</title>

    <script type="text/javascript" language="Javascript">

    function onlyWhite(select)

    {

        var select = document.getElementById('size');

        var value = select.options[select.selectedIndex].value;

        var cselect = document.getElementById('select');

 
        if (value == '3-6mo' || value == '6-12mo' || value == '12-18mo')

        {

            cselect.options.length = 0;

            cselect.options[0] = new Option("----------", "-1", false, false);

            cselect.options[1] = new Option("White", "white", false, false);

        }

        else

        {

            cselect.options.length = 0;

            cselect.options[0] = new Option("----------", "-1", false, false);

            cselect.options[1] = new Option("White", "white", false, false);

            cselect.options[2] = new Option("Red", "red", false, false);

            cselect.options[3] = new Option("White", "Gray", false, false);

        }

        return;

    }

    </script>

</head>

 
<body>

 
<select name="os1" class="cnt" id="size" onchange="onlyWhite()">

    <option value="-1">----------</option>

    <option value="3-6mo">3-6mo</option>

    <option value="6-12mo">6-12mo</option>

    <option value="12-18mo">12-18mo</option>

    <option value="2T">2T</option>

    <option value="3T">3T</option>

    <option value="4T">4T</option>

    <option value="XS">XS</option>

    <option value="S">S</option>

</select>

<select name="os0" class="cnt" id="select">

    <option value="-1">----------</option>

    <option value="white">White</option>

    <option value="red">Red</option>

    <option value="gray">Gray</option>

</select>

 
</body>

</html>

Bruce_KD · 07-06-2008, 04:35 PM

Code:

<script type='text/javascript'>
function disableColors(select) {
  var sId = select.selectedIndex < 3?true:false;
  var colors = document.getElementById('select');
  colors.options[1].disabled = sId;
  colors.options[2].disabled = sId;  
  if (sId && colors.selectedIndex > 0) colors.selectedIndex = 0;
}

</script>

<select name="os1" class="cnt" id="size" onchange="disableColors(this);">
  <option>3-6mo</option>
  <option>6-12mo</option>
  <option>12-18mo</option>
  <option>2T</option>
  <option>3T</option>
  <option>4T</option>
  <option>XS</option>
  <option>S</option>
</select>

<select name="os0" class="cnt" id="select">
  <option>White</option>
  <option>Red</option>
  <option>Gray</option>
</select>

This basically says:
When you change the size of the shirt, check which size you changed it to.
If its the first, second, or third option (selectedIndex starts with the top option being 0, so when selectedIndex < 3), disable the second and third color options.

After doing that, check which color was previously selected. If you had to disable options And the second or third color was selected, set it to white.

Bruce

slipondajimmy · 07-06-2008, 05:37 PM

Thanks for everyones help. I will try to implement this and see what happens

slipondajimmy · 07-07-2008, 03:47 AM

Hey Eric,

I have another question. Is there a way to make that so it will always show 3-6 and white as the default? So the first thing someone sees in the drop down would look this

3-6 White

instead of

------ -------

Then the customer would be able to pick the other sizes and color.

The reason I want to do this is these are only available in white

<option>3-6mo</option>
<option>6-12mo</option>
<option>12-18mo</option>

The other ones are multiple colors.

Thanks again

shockie · 07-07-2008, 03:49 AM

Code:

<option selected>3-6mo</option>

slipondajimmy · 07-07-2008, 09:32 AM

Thanks Shockie I will try that out tonight

07-06-2008, 04:33 PM	#2 (permalink)
Eric NPQ's PA, Slave, and On Call Coder Technical Services Join Date: Mar 2005 Posts: 4,545 0.71 NP$ (Donate)	Not the best, but it works. PHP Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <title>Untitled 1</title> <script type="text/javascript" language="Javascript"> function onlyWhite(select) { var select = document.getElementById('size'); var value = select.options[select.selectedIndex].value; var cselect = document.getElementById('select'); if (value == '3-6mo' \|\| value == '6-12mo' \|\| value == '12-18mo') { cselect.options.length = 0; cselect.options[0] = new Option("----------", "-1", false, false); cselect.options[1] = new Option("White", "white", false, false); } else { cselect.options.length = 0; cselect.options[0] = new Option("----------", "-1", false, false); cselect.options[1] = new Option("White", "white", false, false); cselect.options[2] = new Option("Red", "red", false, false); cselect.options[3] = new Option("White", "Gray", false, false); } return; } </script> </head> <body> <select name="os1" class="cnt" id="size" onchange="onlyWhite()"> <option value="-1">----------</option> <option value="3-6mo">3-6mo</option> <option value="6-12mo">6-12mo</option> <option value="12-18mo">12-18mo</option> <option value="2T">2T</option> <option value="3T">3T</option> <option value="4T">4T</option> <option value="XS">XS</option> <option value="S">S</option> </select> <select name="os0" class="cnt" id="select"> <option value="-1">----------</option> <option value="white">White</option> <option value="red">Red</option> <option value="gray">Gray</option> </select> </body> </html> __________________

07-06-2008, 05:37 PM	#4 (permalink)
slipondajimmy Senior Member Join Date: Nov 2003 Location: Florida Posts: 2,010 117.50 NP$ (Donate)	Thanks for everyones help. I will try to implement this and see what happens __________________ Mascot Factory- Custom Plush, Promotional Plush, and Personalized Teddy Bears\|The Squidget - The tiny travel trailer you build from plans\|

07-07-2008, 03:47 AM	#5 (permalink)
slipondajimmy Senior Member Join Date: Nov 2003 Location: Florida Posts: 2,010 117.50 NP$ (Donate)	Hey Eric, I have another question. Is there a way to make that so it will always show 3-6 and white as the default? So the first thing someone sees in the drop down would look this 3-6 White instead of ------ ------- Then the customer would be able to pick the other sizes and color. The reason I want to do this is these are only available in white <option>3-6mo</option> <option>6-12mo</option> <option>12-18mo</option> The other ones are multiple colors. Thanks again __________________ Mascot Factory- Custom Plush, Promotional Plush, and Personalized Teddy Bears\|The Squidget - The tiny travel trailer you build from plans\|

07-07-2008, 03:49 AM	#6 (permalink)
shockie Senior Member Join Date: Dec 2006 Posts: 4,478 1,025.10 NP$ (Donate)	Code: <option selected>3-6mo</option> __________________ - shockie Linux VPS Hosting From $9.95 With A FREE Control Panel & DOUBLE Burst RAM! Monopoly Companies Binary Addition Coffee Makers & Grinders How to Wash Your Hands 5 Ways To Make Money Blogging Do You Want To Make Money Online?

07-07-2008, 09:32 AM	#7 (permalink)
slipondajimmy Senior Member Join Date: Nov 2003 Location: Florida Posts: 2,010 117.50 NP$ (Donate)	Thanks Shockie I will try that out tonight __________________ Mascot Factory- Custom Plush, Promotional Plush, and Personalized Teddy Bears\|The Squidget - The tiny travel trailer you build from plans\|

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)

Technical Services