Refresh DataTables with JSF and websockets.

guerra

hi
I am trying to update a table using a websocket call with no success. My JSF code looks like this:

<h:form>
                    <f:websocket channel="push">
                        <f:ajax event="updateNotifications" render=":notifications"
                            onevent="upd" />
                    </f:websocket>
                </h:form>
                <h:dataTable id="notifications" value="#{bean.notifications}"
                    var="notification" styleClass="table table-striped table-bordered"
                    headerClass="" rowClasses="">
                    <h:column>
                        <f:facet name="header">Message</f:facet>
                            #{notification.message}
                        </h:column>
                </h:dataTable>

The thing is that with this method new rows are inserted into the table, however the DataTable component doesn't see the updates. The row counter is fixed until I reload the page.
i've tried a javascript function: upd() { table.rows( ).invalidate().draw();} in order to reload the whole table but it doesn't work.

Does anyone has a clue how to perform the DataTable updates?

Thank you.

allan

You need to use the row.add() method to add a new row. row().data() to update and row().remove() to delete.

The invalidate() method will work to update existing rows, but it will not add or delete rows.

I'm not familiar with JSF, but it doesn't look like the answer would be in markup - you'd need to get the socket update messages in Javascript.

Allan