Sunday, February 28, 2016

Oracle JET Live List with WebSocket

I have updated sample - Oracle JET and WebSocket Integration for Live Data, to include live data list. Along with live updates delivered to the chart component, list component displays changed data. I'm displaying five last changes, with new data appearing in the last row:


Watch recorded demo, each 4 seconds new data arrives and chart is updated, along with list records:


JET list component UI structure (data grid) is rendered with a template, to arrange separate column for each job:


When new data arrives, it is being pushed into JET observable array (this triggers automatic UI list reload/refresh). If there are more than five items in the list, first one is removed. List observable array is configured with 500 ms. delay, to make UI refresh smoother:


Download sample application (JET, WebSocket server side and ADF to simulate updates in the DB) - JETWebSocket_v2.zip.

I'm going to present JET and WebSocket integration on Oracle Fusion Middleware Partner Community Forum 2016.
at

4 comments:

  1. AnonymousMarch 14, 2017 at 8:15 AM

    can WebSocket work with CollectionTableDataSource to modify data in CollectionTableDataSource?
    Thanks.

    ReplyDelete
  2. Andrej BaranovskijMarch 14, 2017 at 8:19 AM

    There is no relation between these two. WebSocket is data transport protocol, CollectionTableDataSource is a JET collection. Yes, as you can see in this example - I push data through WebSocket and then this data can be used in any way in JET through JavaScript.

    Andrejus

    ReplyDelete
  3. ShimonMay 4, 2017 at 7:54 AM

    Hi Andrejus

    How do you keep the websocket alive ?

    Thanks
    Shimon

    ReplyDelete
  4. Andrej BaranovskijMay 4, 2017 at 8:03 AM

    It stays alive automatically, unless connection is interrupted.

    Andrejus

    ReplyDelete