Usually an item subscribed in COMMAND mode is displayed through a DynaMetapushTable. However if your application directly takes care of the view, then a NonVisualTable can be employed.

This post briefly shows how to modify the Portfolio Demo in order to use a NonVisualTable.

The last lines of the PortfolioDemo index.html page will become:

Code javascript:
  1.     /////////////////////////////////table handler
  2.         var table = new NonVisualTable("portfolio", schema, "COMMAND");
  3.         table.setSnapshotRequired(true);
  4.  
  5.         // the following settings were used to control the behaviour
  6.         // of the DynaMetapushTable; with NonVisualTable, all
  7.         // formatting, paging and sorting stuff, if required,
  8.         // should be managed by custom code
  9.  
  10.         // table.setPushedHtmlEnabled(false);
  11.         // table.setClearOnDisconnected(true);
  12.         // table.onChangingValues = formatValues;
  13.         // table.setMaxDynaRows("unlimited");
  14.         // table.setMetapushFields(2, 1);
  15.         // table.setMetapushSort(3, direction);
  16.  
  17.         table.onItemUpdate = myUpdateHandler;
  18.  
  19.         lsPage.addTable(table, "info");
Some code in the original index.html is no longer needed, because it is related to the DynaMetapushTable. In particular, the <TABLE> element has to be replaced with the custom GUI object and the "changeSort" and "formatValues" functions (together with their helper functions: "formatTime", "formatDecimal" and "convertCommaToDot") can be removed.

A new "myUpdateHandler" function, on the other hand, is now needed. It may be coded in the following way:

Code javascript:
  1.     function myUpdateHandler(item, updateValues) {
  2.         // item should be always 1
  3.         // updateValues is of type "UpdateItemInfo"
  4.             // (see the JSDocs for details)
  5.  
  6.         var commandField = 2;
  7.             // the "command" field is the second field
  8.             // on the specified schema
  9.         var keyField = 1;
  10.             // the "key" field is the first field
  11.             // on the specified schema
  12.  
  13.         var command = updateValues.getNewValue(commandField);
  14.         var key = updateValues.getNewValue(keyField);
  15.         if (command == "ADD") {
  16.             addRowOnMyGUI(key, updateValues);
  17.         } else if (command == "UPDATE") {
  18.             updateRowOnMyGUI(key, updateValues);
  19.         } else if (command == "DELETE") {
  20.             deleteRowOnMyGUI(key);
  21.         }
  22.     }

The new "addRowOnMyGUI", "updateRowOnMyGUI" and "deleteRowOnMyGUI"
functions should be added. The supplied "updateValues" object can be used in order to find the current values of the subscribed fields ("stock", "price", "qty", "cval" and "time"), by invoking on it the "getNewValue" method, with parameter 3, 4, 5, 6 or 7.