Focus lost on table row element right after its set

Question

I have a very long table in which I am using a search box to search for a table row. The .focus() function sets focus on the table row element but immediately it jumps back to the search box and sets focus to it. I don't know why this happens.

<ice:inputText value="#{bean.searchStr}" maxlength="8" size="8" 
                                  onkeyup="enterToSearch(event, this.id);"/>
.....
<ice:commandLink actionListener="#{bean.search}"></ice:commandLink>

function focusSelectedRow(rowId) {
    // Using some other element's id to get to the tr element 
    // and rowId does not correspond to the actual table row
    var rowElem = document.getElementById(rowId);
    var trElem = rowElem.parentNode.parentNode.parentNode;
    var tableElem = trElem.parentNode.parentNode;
    var children = trElem.parentNode.childNodes;
    var rowNum = 1;
    var rowHeight = trElem.offsetHeight;
    for (var i=0 ; i < children.length ; i++) {
        if(children[i] == trElem) rowNum = i+1; 
    }
    trElem.tabIndex = 999;
    trElem.style.backgroundColor = '#FFFF00';
    trElem.focus();
    // The below is used because, if the scroll bar is manually adjusted the focus 
    // is not retained for the next search
    tableElem.scrollTop = rowNum*rowHeight;
}

function enterToSearch(event, id) {
    var keyCode = event.keyCode ? event.keyCode : event.which ? event.which : event.charCode;
    if(keyCode == 13)
    {
        document.getElementById(id).parentNode.parentNode.childNodes[3].childNodes[0].click();
    }
}

Answer 1

The solution is to add the below line right after .focus() function

trElem.scrollToIndex();