ユーザーが「hier_start」を変更すると、ページが更新され、ドロップダウンが選択されたばかりの選択で事前に選択されるように、これを設定しようとしています。
<form name='categories' id="categories">
<div class="row">
<select name="hier_start" onchange="javascript: NextCat('A', this.value)">
<option value="0" parent="0">Select...</option>
[% FOREACH hier_start IN categories.keys %]
<option value="[% hier_start %]">[% hier_start %]</option>
[% END %]
</select>
<select name="hier_A" style="display:none" onchange="javascript: NextCat('B', this.value)">
<option value="0" parent="0">Select...</option>
</select>
<select name="hier_B" style="display:none" onchange="javascript: NextCat('C', this.value)">
<option value="0" parent="0">Select...</option>
</select>
<select name="hier_C" style="display:none" onchange="javascript: NextCat('D', this.value)">
<option value="0" parent="0">Select...</option>
</select>
<select name="hier_D" style="display:none">
<option value="0" parent="0">Select...</option>
</select>
</div>