eContent – Computer Science Department (UG)


Column Toggle Table

The “column toggle table” will hide columns when there is not enough width to display the data.

In this example we have used the well-known Northwind sample database. Below is a selection from the “Customers” table.

Slowly resize the width of your browser window. The layout will adjust itself to fit the “new” width of the browser. OR, you can use the “Columns…” button to choose which column should be hidden or shown.

CustomerID CustomerName ContactName Address City PostalCode Country
1 Alfreds Futterkiste Maria Anders Obere Str. 57 Berlin 12209 Germany
2 Antonio Moreno Taquería Antonio Moreno Mataderos 2312 México D.F. 05023 Mexico
3 Around the Horn Thomas Hardy 120 Hanover Sq. London WA1 1DP UK
4 Berglunds snabbköp Christina Berglund Berguvsvägen 8 Luleå S-958 22 Sweden

Footer Text