Reputation: 317
I'm trying to implement a chat function using rich:extendedDataTable. I can receive messages as they come in by polling the table just fine, but each time I poll the table it scrolls back to the top, making it impossible to read earlier messages. Is there a way to disable that function, or to load in such a way that it doesn't refresh the entire table but instead adds rows as needed? Here is the code:
<rich:extendedDataTable
id="message_list"
var="message"
value="#{studentChat.chatLog.messages}">
<rich:column width="100%">
<f:facet name="header">
<h:outputText value="Messages" styleClass="label_general"/>
</f:facet>
<!-- Style blue if teacher sent, light grey if student sent -->
<div style="border-radius:3px; background-color: #{(message.senderRole eq loggedUser.role ) ? '#b9caee': '#eeeeee'}">
<h:outputText value="#{message.message}" style="font-size: 1.3em"/><br></br>
<h:outputText value="sent #{message.timestamp}" style="float:right; font-size:.9em" /><br></br>
<h:outputText value="#{message.viewed ? 'read' :'delivered'}" style="font-size: .9em; float: right" />
</div>
</rich:column>
</rich:extendedDataTable>
It is being polled by an each second. I am limited to Richfaces 3 and JSF 1.2. Thanks in advance!
Upvotes: 0
Views: 671
Reputation: 317
I got an answer from a coworker. It's actually incredibly simple. All you have to do is wrap a normal dataTable within a panelGroup as follows:
<h:panelGroup layout="block" style="overflow: auto; height: 700px">
<h:dataTable id="myTable" ></h:dataTable>
</h:panelGroup>
With this setup you can still use a poll on the table, but the parent component isn't rerendered so it the user isn't forced to scroll back to the top.
Hope that helps someone else as much as it did me!
Upvotes: 1