Problem regarding focusing elements after submit

Question

Hi all
I have a bunch of radio groups with submit on my page . The requirement is to set focus on the next radiogroup with submit after any radiogroup with submit is clicked.
But the problem is When user changes the value the focus is moving to the top of the page. Is there any way that we can keep the focus on the same item or other item at the same level ?
I have written the following statement in HTML Form Element Attributes and Form Element Option Attributes of the first radiogroup with submit (called P4_X) : onClick = "document.getElementById('P4_E').focus();" (The last radiogroup with submit on the page is called P4_E).
But alas it just doesnt work :-(
If this is any help, I am pasting a sniplet of the 'view source' of my page
<td colspan="2" valign="top" class="t3Body"><table class="formlayout" summary="" ><tr><td nowrap="nowrap" align="right"><a class="t3optionalwithhelp" href="javascript:popupFieldHelp('3886301842732082','12829541423701975766')" tabindex="999"></a></td>
<td colspan="1" rowspan="1" align="left"><input type="hidden" name="p_arg_names" value="3886301842732082" /><fieldset id="P4_X"><input type="radio" name="p_v01" value="%null%" onclick="doSubmit('P4_X')" onClick = "document.getElementById('P4_E').focus();" /><span onClick = "document.getElementById('P4_E').focus();">%</span>
<input type="radio" name="p_v01" value="choice1" checked="checked" onclick="doSubmit('P4_X')" onClick = "document.getElementById('P4_E').focus();" id="P4_X_1" />
<span onClick = "document.getElementById('P4_E').focus();"><label for="P4_X_1">choice1</label></span>
<input type="radio" name="p_v01" value="choice2" onclick="doSubmit('P4_X')" onClick = "document.getElementById('P4_E').focus();" id="P4_X_2" />
<span onClick = "document.getElementById('P4_E').focus();"><label for="P4_X_2">choice2</label></span>
<input type="radio" name="p_v01" value="choice3" onclick="doSubmit('P4_X')" onClick = "document.getElementById('P4_E').focus();" id="P4_X_3" />
<span onClick = "document.getElementById('P4_E').focus();"><label for="P4_X_3">choice3</label></span></fieldset>
<td colspan="1" rowspan="1" align="left"><input type="hidden" name="p_arg_names" value="3891304050742114" /><fieldset id="P4_E"><input type="radio" name="p_v08" value="choice1" onclick="doSubmit('P4_E')" id="P4_E_0" />
<label for="P4_E_0">choice1</label>
<input type="radio" name="p_v08" value="choice2" onclick="doSubmit('P4_E')" id="P4_E_1" />
<label for="P4_E_1">choice2</label>
<input type="radio" name="p_v08" value="choice3" onclick="doSubmit('P4_E')" id="P4_E_2" />
<label for="P4_E_2">choice3</label></fieldset>
<a class="eLink" title="Edit" href="javascript:popupURL('f?p=4000:371:14317056829894007819::::P371_ID,FB_FLOW_ID,FB_FLOW_PAGE_ID:3891304050742114,101,4');" tabindex="999"><img src="/i/e.gif" alt="Edit" class="eLink" /></a></td></tr>
Please help me out !!
Regards
-Shantanu Dhanuka

Answer 1

Hi,
1 - Create a new HTML region on your page called "Scripts" and in the "Display Point" select "Before Footer" - this places the region at the bottom of the page.
2 - Create a new Item and put in the new region. Call the item P1_FOCUS_FIELD. Set its Default Value to the name of the field that will receive the focus when the page is FIRST loaded (P_E_1?).
3 - In the new region's Region Footer, add in the following:
&lt;script type="text/javascript"&gt;
var f = document.getElementById("P1_FOCUS_FIELD").value;
document.getElementById(f).focus();
&lt;/script&gt;
4 - Update your submit process to set the value of P1_FOCUS_FIELD to the ID of the field that you want to receive the focus when the page is reloaded.
Regards
Andy