Simple ajax sample(richfaces-demo main data table page used originally):

 <h:form> 
 <rich:dataTable 
 onRowMouseOver="this.style.backgroundColor='#F1F1F1'"
 onRowMouseOut="this.style.backgroundColor='#{a4jSkin.tableBackgroundColor}'"
 cellpadding="0" cellspacing="0" id="table"
 width="700" border="0" var="record" value="#{report.expReport.records}">
 
 <f:facet name="header">
//header there
 </f:facet>
 
 <rich:column  colspan="5">
 <a4j:commandLink value="+/-" reRender="table">
 <a4j:actionparam name="shown" value="#{not record.showDetails}" assignTo="#{record.showDetails}"/>
 </a4j:commandLink>
 <h:outputText value="#{record.city}" />
 </rich:column>
 
 <rich:subTable rendered="#{record.showDetails}"
 onRowMouseOver="this.style.backgroundColor='#F8F8F8'"
 onRowMouseOut="this.style.backgroundColor='#{a4jSkin.tableBackgroundColor}'"
 var="expense" value="#{record.items}">
 <rich:column>
 <h:outputText value="#{expense.day}"></h:outputText>
 <f:facet name="footer">
 <rich:spacer />
 </f:facet>
 </rich:column>
//more columns there 

 </rich:subTable>
 
 <f:facet name="footer">
//footer there
 </f:facet>
 
 </rich:dataTable>
</h:form>

and showDetails variable added to Record object additionally.

Could be also done just at client side. In that case - need just iterate tr siblings of the row with link which has subtable classes and revert display style. But I believe ajax way more convenient as it in sync with server side state.