Overview

Tabular views display information in table form, typically showing one item per row, and providing the ability to sort the rows by clicking on column headers. For example, the Device View is shown here:

See this tutorial for details on how to develop a tabular view for your ONOS Application.

View Header

At the top of every tabular view is a header providing the table title on the left, and a set of control buttons on the right.

Control Buttons

The control buttons provide additional functionality for the table view. Most tables include a Refresh-enabled toggle button. Other buttons may also be provided, depending on the view.

Refresh ButtonRefresh: Tables with this button auto-refresh every two seconds. Click on this button disable or enable the auto-refresh feature.

Table Body

The body of the table is scrollable. Your browser's Find/Search capabilities can be used to quickly find something in the table; use Cmd-F (Mac) or Ctrl-F (Windows).

"Loading..." Animation

If the server takes more than a few hundred milliseconds to respond, a "loading..." animation will appear, indicating that the client is waiting for a response from the server:

Table Columns

The data in the table is sortable; click on a column header to sort rows by values in that column. A small triangle indicating the sort direction will be displayed after the column name:

Table Rows

Each row in the table represents a single item. When an item is added or updated, the row will briefly flash yellow, as shown below:

Selectable Rows

Tables may implement selectable rows: clicking on a row highlights it and displays a details panel with more information about the selected item. Clicking on a different row selects a new item and updates the details panel appropriately. Clicking on the selected row again (or pressing the Esc key) deselects the item:

Empty Tables

If there are no items to display, an "empty" table will be shown: