Wednesday, March 25, 2009

Cursor Focus on OA page

Initial Cursor Focus is a highly under rated requirement in OA framework and mostly it is put on the back burner during design/coding. And there is no clear documentation for this feature and may be OA dev guide avoided it because we need to use Java Script for it; which is considered sacrilegious in OAF. We designed and deployed around 50 pages to production and realized the importance of cursor focus only when the users started whining about it. Hey, but they had a valid case, some times they open a page and scans a lot number immediately. But if the focus was on URL browser field, it will take them to different page. And worse, some users started complaining about carpal tunnel symptoms due to excessive usage of mouse. So when we started fixing the pages for initial cursor focus we found ourselves in a difficult situation for some pages like the one which have tab region or one with table region.

Simple messageText field.

Initial cursor focus on single row region is simple and straightforward.


String id = "myId"; // ID of the field
OABodyBean bB = (OABodyBean)pageContext.getRootWebBean();
bB.setInitialFocusId(id);


Tab region

We need to find the current active tab and then focus on the field for that tab.


OABodyBean bB = (OABodyBean)pageContext.getRootWebBean();
OASubTabLayoutBean tBean = (OASubTabLayoutBean)webBean.findIndexedChildRecursive("tabRegionId");
if(tBean != null)
{
int tabIndex = tBean.getSelectedIndex(pageContext);
if(tabIndex == 0)
bB.setInitialFocusId("id1");
else if (tabIndex == 1)
bB.setInitialFocusId("id2");


Table region

This is tricky and there is no direct OA supported way of doing this. OA framework (UIX) suffixes N: to the table field id while creating the final HTML page. Based on this fact following javascript function will do the trick.


// id is ID of your bean
// rowIndex is the row number you want to focus.
function setTableFocus(id,rowIndex)
{
for (i = 0; i< 100 ; i++)
{
var bean = document.getElementById('N' + i+ ':' + id + ':' + rowIndex);
if(bean != null)
{
bean.focus();
break;
}
}
}


OABodyBean bB = (OABodyBean)pageContext.getRootWebBean();
pageContext.putJavaScriptFunction("focusTag",);
bB.setOnLoad("setTableFocus('" + id + "'," + 1 + ")"); // focus on first row.



We created an utility class to handle all these scenarios. FocusMap.java. Read javadoc for its usage.

No comments: