How to set focus to h:inputText inside rich:dataTable as one column after pressing a4j:commandButton like (+) in footer of rich:dataTable? - jsf-1.2

Question

I am using JSF 1.2 and Richfaces 3.3.3 in my sample JSF Application.
I have a form with rich:dataTable that having single column with h:inputText and footer having a4j:commandButton with value "add".
when I click "add" button then new row adding in rich:dataTable and that is working fine.
My need is after pressing "add" button the focus have to go newly created row to the h:inputText field...
sample code :
<rich:dataTable value="" var="">
<rich:column>
<f:facet name="header">
<h:outputText value="name" />
</f:facet>
<h:inputText id="name" value="#{obj.name}">
</rich:column>
<f:facet name="footer">
<a4j:commandButton value="add" action="{actionMethod}" />
</f:facet>
</rich:dataTable>
when I click "add" button then new row adding in rich:dataTable and that is working fine.
My need is after pressing "add" button the focus have to go newly created row to the h:inputText field...
How to do this using JQuery or java script, any idea?

Answer 1

Please find below the javascript for setting focus.
function setFocus() {
var displayedRowsCountValue = document
.getElementById("exampleManageBean:displayedRowsCountValue").value;
var firstRowIndexValue = document
.getElementById("exampleManageBean:firstRowIndexValueId").value;
displayedRowsCountValue = parseInt(firstRowIndexValue - 1)
+ parseInt(displayedRowsCountValue);
for (i = parseInt(firstRowIndexValue - 1); i < parseInt(displayedRowsCountValue); i++) {
var tmpComponent = "selectedId[" + i + "]";
var temp = (document.getElementsByName(tmpComponent)[1]);
if (temp != null && temp.checked == true) {
var temp1 = document
.getElementById("exampleManageBean:exampleTable:"
+ i + ":exampleTextBox");
temp1.focus();
}
}
}
The displayedRowsCountValue & firstRowIndexValueId should be taken from t:dataScroller