Repeating additional Input dropdown array content

I’m laughing at my Summary as I don’t know how concisely say it.

This is a product catalog with a CMS Admin Panel.
Some products will use identical Accessories so instead of copying all that content from one product to the next, we inserted a check box that when clicked ON will load a drop down with an array of products. Select from the array of products that the Accessories match on and feeds into the box below it.
In this image, box is checked, array populates and ‘Lights’ were selected so that the Lights content populated from the source.

The second drop down you see was not originally there.
That is from me playing around with it trying to get this to work.
so, I want that second drop down to appear once the first one is filled in (and repeat and repeat again until we stop making selections)
Then when the second one is selected from the drop down array, it ADDS to the bottom of the content in the box. Right now, it’s just replacing it.

Below is the piece of code that runs it, the checkbox and the drop down.


	<tr>								
		<td width="29%" align="right" class="f-c">								
		<input name="copy_as" id="copy_as" value="Yes" <?php if($copy_as == "Yes"){ ?> checked="checked" <?php } ?> type="checkbox" onclick="show_product_list(this.checked,'access_product_list_lable_td','access_product_list_td','pproduct_list','access');" />								
		</td>
		<td width="71%" class="f-c">Check this if you want to copy the accessories content from other product</td>
	</tr>
	<tr>
		<td width="29%" align="right" class="f-c"  id="access_product_list_lable_td"></td>
		<td width="71%" class="f-c"  id="access_product_list_td" style=" <?php if($copy_as == "Yes"){ ?> display:block; <?php }else{ ?> display:none;<?php } ?>" >
			<select id="pproduct_list" name="pproduct_list" onchange="change_accessories_content(this.value);">
				<option value="">Please select</option>
										<?php
											$product_query = "select name,id from products order by name";
											$product_result = mysql_query($product_query) or die(mysql_error());
											while($product_row = mysql_fetch_array($product_result))
											{
												$product_name = $product_row['name'];
												$product_id = $product_row['id'];
										?>
										<option value="<?php echo $product_row['id'];?>" <?php if($pproduct_list == $product_id){ ?> selected="selected"<?php } ?>><?php echo $product_row['name'];?></option>
										<?php
											}
										?>
			</select>
		</td>
	</tr>

I’m going to flag this post for moving to Javascript, as it’s the Javascript that you’re trying to manipulate mostly, not the PHP.

so, I want that second drop down to appear once the first one is filled in (and repeat and repeat again until we stop making selections)

Javascript would be making things appear and disappear. However, you want it to dynamically populate the secondary list; this will require AJAX.

Then when the second one is selected from the drop down array, it ADDS to the bottom of the content in the box. Right now, it’s just replacing it.

onchange=“change_accessories_content(this.value);”>

This javascript function is the one controlling what happens to your content box. The Javascript team will need to see the contents of this function.

Off Topic:

Pandora was a female, and never was inside the box (which was actually a jar).

Thank you for the correction! Appreciate it.

The Pandora line is a quote from Pineapple Express. :slight_smile:

Off Topic:

Pandora was a female, and never was inside the box (which was actually a jar).