I ended up writing a full JavaScript for each selection, long winded but i could not find another way.
As you may see this is an example, i had other components up the tree, but this should tell you how to do it.
[%# This Source Code Form is subject to the terms of the Mozilla Public
# License, v. 2.0. If a copy of the MPL was not distributed with this
# file, You can obtain one at http://mozilla.org/MPL/2.0/.
#
# This Source Code Form is "Incompatible With Secondary Licenses", as
# defined by the Mozilla Public License, v. 2.0.
#%]
[%# INTERFACE:
# classifications: array of hashes, with an 'object' key representing a
# classification object and 'products' the list of
# product objects the user can enter bugs into.
# target: the script that displays this template.
# cloned_bug_id: ID of the bug being cloned.
# format: the desired format to display the target.
#%]
[% IF target == "enter_bug.cgi" %]
[% title = "Enter $terms.Bug" %]
[% h2 = BLOCK %]First, you must pick a product on which to enter [% terms.abug %]: [% END %]
[% ELSIF target == "describecomponents.cgi" %]
[% target = "buglist.cgi" %]
[% title = "Browse" %]
[% h2 = "Select a product category to browse:" %]
[% END %]
[% DEFAULT title = "Choose a Product" %]
[% PROCESS global/header.html.tmpl %]
[% USE Bugzilla %]
[%# This script displays the descriptions for selected components. %]
<script type="text/javascript">
var classifications = new Array([% classifications.size %]);
[% count = 0 %]
[% FOREACH cl = classifications %]
classifications[[% count %]] = "[% cl.object.name FILTER js %]";
[% count = count + 1 %]
[% END %]
function setComponentSelection() {
//hide all following areas
document.getElementById("subCompBody").style.visibility = 'hidden';
document.getElementById('subcomponent').selectedIndex=-1;
var compSel = document.getElementById('component');
var compInd = compSel.selectedIndex;
if(compInd != -1)
{
var subcompSel = document.getElementById('subcomponent');
subcompSel.options.length = 0;
//get classification
var classSel = document.getElementById('classification');
var classInd = classSel.selectedIndex;
var showSubCompBody = 0;
if(classInd != -1)
{
[% FOREACH cll = classifications %]
if(classSel.options[classInd].text == "[% cll.object.name FILTER js %]")
{
[% bug.classification = cll %]
var prodSel = document.getElementById('product');
var prodInd = prodSel.selectedIndex;
if(prodInd!=-1)
{
[% FOREACH p = cll.products %]
if(prodSel.options[prodInd].text == "[% p.name FILTER js %]")
{
[% bug.product = p %]
[% FOREACH c = p.components %]
if(compSel.options[compInd].text == "[% c.name FILTER js %]")
{
[% bug.component = c %]
[% FOREACH field = Bugzilla.active_custom_fields %]
[% IF field.name == "cf_subcomponent" %]
[%- FOREACH fl = field.legal_values %]
[% IF c.name == fl.visibility_value.name %]
showSubCompBody = 1;
var option = document.createElement("option");
option.text = "[% fl.name FILTER js %]";
option.value = "[% fl.name FILTER js %]";
subcompSel.add(option);
[% END %]
[% END %]
[% END %]
[% END %]
}
[% END %]
}
[% END %]
}
}
[% END %]
}
if(showSubCompBody==1)
document.getElementById("subCompBody").style.visibility = 'visible';
}
}
function hideCombos(){
//hide all combo boxes if java script is supported, if not they should all stay shown
document.getElementById("productBody").style.visibility = 'hidden';
document.getElementById("componentBody").style.visibility = 'hidden';
document.getElementById("subCompBody").style.visibility = 'hidden';
}
</script>
<h2>[% h2 FILTER html %]</h2>
<form action="[% target %]?component=[% c.name FILTER uri %]&cf_subcomponent=[% subComp.name FILTER uri %]
[%- IF cloned_bug_id %]&cloned_bug_id=[% cloned_bug_id FILTER uri %][% END -%]
[%- IF format %]&format=[% format FILTER uri %][% END %]">
<table>
<tbody id="componentBody">
<tr id="field_container_component">
[% component_desc_url = BLOCK -%]
describecomponents.cgi?
[% END %]
[% INCLUDE "bug/field-label.html.tmpl"
field = bug_fields.component editable = 1
desc_url = component_desc_url
%]
<td>
<select name="component" id="component" onchange="setComponentSelection();"
size="10" aria-required="true" class="required">
[%- FOREACH cl = classifications %]
[%- FOREACH p = cl.products %]
[%- FOREACH c = p.components %]
<option value="[% c.name FILTER html %]"
id="v[% c.id FILTER html %]_product">
[% c.name FILTER html -%]
</option>
[% END %]
[% END %]
[%- END %]
</select>
</td>
</tr>
</tbody>
<tbody id="subCompBody">
<tr>
<td>
<font color="red">*</font>Sub Component:
</td>
<td>
[% FOREACH field = Bugzilla.active_custom_fields %]
[% IF field.name == "cf_subcomponent" %]
<select name="cf_subcomponent" id="subcomponent" "
size="10" aria-required="true" class="required">
[% FOREACH fl = field.legal_values %]
<option value="[% fl.name FILTER html %]"
id="v[% fl.id FILTER html %]_product">
[% fl.name FILTER html -%]
</option>
[% END %]
</select>
[% END %]
[% END %]
</td>
</tr>
</tbody>
<tr>
<th colspan="2"> </th>
</tr>
<tr>
<th>
<input type="submit" value="Select"/>
</th>
</tr>
<script type="text/javascript">
hideCombos();
</script>
</tbody>
</table>
</form>