I was wondering if someone could give me a hand with something I'm trying to do....

I want to change This Page so that it will show up with two option boxes rather than one but at the same time having the option boxes connected so that if a catagory is slected in box one the that catagory's sub catagories will show up in box two and will change if the choice in box one is changed so that it will corraspond correctly...

this is the code that I've got for the page thus far

<select name="catid">
<?
$plus = "+";
$minus = "-";
$node = "o";

$result = mysql_query("SELECT * FROM dir_cats ORDER by holder ASC");
$list = @mysql_num_rows($result);
while ($i < $list) {
$row = mysql_fetch_array($result);
$id = $row["CatID"];
$name1 = $row["Name"];
$parent = $row["Parent"];
$level = $row["level"];
$holder = $row["holder"];
$isparent = $row["isparent"];

for ($a=1;$a <= $level;++$a) {
$spaces = '&nbsp;&nbsp;&nbsp;&nbsp;' . $spaces;
}

if ($isparent == '1') {
     if ($parent == '0') {
     print"<option value=\"$id\">$plus $plus $plus $name1</option>";
     }
     else {
     print"<option value=\"$id\">$plus $plus $plus $name1</option>";
     }
}
else {
     if ($parent == '0') {
     print"<option value=\"$id\">$node $node $name1</option>";
     }
     else {
     print"<option value=\"$id\">$node $node $name1</option>";
     }

}


$i++;
$spaces = '';
}
?>

and this is what I'm thinking I have to add... but the problem is that I don't know how to add it and still have it work properly.... (continued in next post)

    (continued from previous post)

    <BODY>

<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">

<!--



//	Initialize class for Type and Style



function Type(id, type){

	this.id = id;

	this.type = type;

}



function Style(id, id_type, style){

	this.id = id;

	this.id_type = id_type;

	this.style = style;

}



//	Initialize Array's Data for Type and Style



TypeArray = new Array(

		new Type(1, "Apparel"),

		new Type(2, "Shoes"),

		new Type(5, "Accessories")

);



StyleArray = new Array(

		new Style(4, 1, "Apparel_1"),

		new Style(7, 1, "Apparel_2"),



		new Style(41, 2, "Shoes_3"),

		new Style(21, 2, "Shoes_4"),

		new Style(17, 2, "Shoes_2"),



		new Style(30, 5, "Accessories_3"),

		new Style(27, 5, "Accessories_4"),

		new Style(31, 5, "Accessories_3")

);





function init(sel_type, sel_style){



	document.product.id_type.options[0]	= new Option("[ Type ]");

	document.product.id_style.options[0] = new Option("[ Style ]");

	for(i = 1; i <= TypeArray.length; i++){

		document.product.id_type.options[i]	= new Option(TypeArray[i-1].type, TypeArray[i-1].id);

		if(TypeArray[i-1].id == sel_type)

			document.product.id_type.options[i].selected = true;

	}

	OnChange(sel_style);



}



function OnChange(sel_style){



	sel_type_index = document.product.id_type.selectedIndex;

	sel_type_value = parseInt(document.product.id_type[sel_type_index].value);



	for(i = document.product.id_style.length - 1; i > 0; i--)

		document.product.id_style.options[i]	= null;



	j=1;

	for(i = 1; i <= StyleArray.length; i++){

		if(StyleArray[i-1].id_type == sel_type_value){

			document.product.id_style.options[j]	= new Option(StyleArray[i-1].style, StyleArray[i-1].id);

			if(StyleArray[i-1].id == sel_style)	document.product.id_style.options[j].selected = true;

			j++;

		}

	}



}

//-->

</SCRIPT>

<form name="product">

  <select name="id_type" size="1" style="width: 150px;" onChange="OnChange()">

  </select>

  <select name="id_style" size="1" style="width: 150px;">

  </select>

</form>

      Please... if someone would be so kind... I really do need some help with this.. it's in an awful state and I'm not quite sure how to fix it...

        if someone would be so kind as to even make a sugguestion as to how this might be fixed if not with javascript than some other way using php and mysql I would be greatly appreciative 🙂

        Thank you again for your time
        ~af831

          LOL, you really like Obkect oriented programming, both in PHP and Javascript. LOL

          I looked at your code and you have some functions names after event handlers in your javascript.

          Now, if I am not mistaken, that may not work in javascript since the event handlers are reserved keywords.

          I know vbscript works like this, but I am not sure about javascript.

          Change your function names to more unique ones.

          I could be wrong here, but when I looked at your code, that was the first thing that jumped out at me.

            accually the javascript that's there isn't set in stone by any means.... I got it from this page as a template for what to use to be able to do what I'm looking to do... if you have any other sugguestions at all ... please feel free.... I seem to be completely at a loss as to how to fix it all so it works

            Thanks
            ~af831

              Write a Reply...