Have questions? Stuck? Please check our FAQ for some common questions and answers.

You are viewing an old version of this page. View the current version.

Compare with Current View Page History

« Previous Version 14 Next »

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 this button to toggle auto-refresh off and on again.

Table Body

The body of the table is scrollable. Your browser's Find/Search capabilities work in the view, so if you want to quickly find something in the table you can 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 column headers for each section in the table are sortable. Once any header is clicked on, table will be sorted in ascending order and an icon will appear indicating the sorting direction.

If the same table header is clicked on again, then the sorting direction will reverse and the table will be sorted in descending order by that header. The icon will change to indicate the new sorting direction.

You can toggle between ascending and descending on most headers.

Table Rows

Each row in the table represents one of the components you are viewing. When a new component is added or updated the row will flash yellow, as shown below.

Empty Tables

If there are no components of that type, then an "empty table" will be displayed instead. The example below is the Intent View, with no intents:

  • No labels