When might a REGION_ID change?

Question

I'm wanting to use the method outlined here (Re: javascript: display region to hide and show regions on a page.
My concern is that REGION_IDs aren't something you can really get a handel on unless you dig it out of the generated code (or use Carl's trick of putting it in a region template). And you definately don't have any control over it as a developer.
I'm wondering when region id's might change? If I deploy my application to another system, will I have problems due to REGION_IDs changing?
It would be greate if there were a handle on a region that we (the developers) had control over for use in javascript and ajax.
Thanks
Doug

Answer 1

Resolved with the following approach which works fine for v2. Sounds like v3 makes life a little easier,
Phil
================================
1. Nodify Page Template
================================
<table class="t10ReportsRegion" id="#REGION_ID#" border="0" cellpadding="0" cellspacing="0" summary="">
<script type="text/javascript">
if(!pTabList_IDS){var pTabList_IDS = new Array();}
pTabList_IDS[pTabList_IDS.length] = "#REGION_ID#"
</script>
<tr>
<td width="3"><img src="#IMAGE_PREFIX#themes/theme_10/region_left_top.gif" alt=""/></td>
<td class="t10RegionHeader"><table border="0" cellpadding="0" cellspacing="0" summary="">
<tr>
<td><img src="#IMAGE_PREFIX#themes/theme_10/region_title_left.gif" alt=""/></td>
<td class="t10RegionTitle">#TITLE#</td>
<td width="7"><img src="#IMAGE_PREFIX#themes/theme_10/region_title_right.gif" alt=""/></td>
</tr>
</table></td>
<td><img src="#IMAGE_PREFIX#themes/theme_10/region_right_top.gif" alt=""/></td>
</tr>
<tr>
<td class="t10RegionLeft"><img src="#IMAGE_PREFIX#themes/theme_10/region_left_middle.gif" alt=""/></td>
<td class="t10ButtonHolder" align="right">#CLOSE#<img src="#IMAGE_PREFIX#themes/theme_10/1px_trans.gif" height="1" width="15" alt=""/>#PREVIOUS##NEXT##DELETE##EDIT##CHANGE##CREATE##HELP#
</td>
<td class="t10RegionRight"><img src="#IMAGE_PREFIX#themes/theme_10/region_right_middle.gif" alt=""/></td>
</tr>
<tr>
<td class="t10RegionLeft"><img src="#IMAGE_PREFIX#themes/theme_10/region_left_middle.gif" alt=""/></td>
<td class="t10RegionBody">#BODY#</td>
<td class="t10RegionRight"><img src="#IMAGE_PREFIX#themes/theme_10/region_right_middle.gif" alt=""/></td>
</tr>
<tr>
<td><img src="#IMAGE_PREFIX#themes/theme_10/region_left_bottom.gif" alt=""/></td>
<td class="t10RegionFooter"><img src="#IMAGE_PREFIX#themes/theme_10/region_middle_bottom.gif" alt=""/></td>
<td><img src="#IMAGE_PREFIX#themes/theme_10/region_right_bottom.gif" alt=""/></td>
</tr>
</table>
================================
2. Edit Page HTML Body Attribute
================================
onload="javascript:Select1();"
================================
3. Edit HTML Header
================================
<script type="text/javascript">
function Select1()
l_category2 = html_GetElement('P201_INDICATOR').value;
if (l_category2 == "N")
document.getElementById('P201_ANOTHER_INDICATOR').value = 'N'
html_ShowElement(pTabList_IDS[2])
html_ShowElement(pTabList_IDS[3])
html_HideElement(pTabList_IDS[4]) //
html_ShowElement(pTabList_IDS[5]) //
html_ShowElement(pTabList_IDS[6]) //
html_ShowElement(pTabList_IDS[7])
html_ShowElement(pTabList_IDS[8])
html_ShowElement(pTabList_IDS[9])
else if (l_category2 == "Y")
html_ShowElement(pTabList_IDS[2])
html_ShowElement(pTabList_IDS[3])
html_ShowElement(pTabList_IDS[4])
html_ShowElement(pTabList_IDS[5])
html_ShowElement(pTabList_IDS[6])
html_ShowElement(pTabList_IDS[7])
html_ShowElement(pTabList_IDS[8])
html_ShowElement(pTabList_IDS[9])
else if (l_category2 == '%null%')
html_HideElement(pTabList_IDS[2])
html_HideElement(pTabList_IDS[3])
html_HideElement(pTabList_IDS[4])
html_HideElement(pTabList_IDS[5])
html_HideElement(pTabList_IDS[6])
html_HideElement(pTabList_IDS[7])
html_HideElement(pTabList_IDS[8])
html_HideElement(pTabList_IDS[9])
</script>
======================================================
4. And ensure that P201_INDICATOR also fired the event
Edit HTML Form Element Attributes
======================================================
onclick="javascript:Select1();"