TableSheet Components

A tablesheet consists of various components, each with its unique functionalities and customizations.

TableSheet Panel

A tablesheet panel consists of the View name and the field names. Field names can also consist of calculated fields and related fields.

You can select which columns are shown or hidden in the tablesheet view and drag a field to adjust its order in the fields collection. By default, the panel only shows the column captions.

If the captions are missing then the field names are shown. You can also set the showSource option to "all" to show field names beside the captions.

The following code example shows how to create a tablesheet panel.

//init a table sheet panel
var host = document.getElementById("panel");
panel = new GC.Spread.Sheets.TableSheet.TableSheetPanel("myPanel", sheet, host);

The TableSheetPanel class provides methods such as attach, detach, and destroy, to interact with a tablesheet panel in runtime.

The following code sample shows how to work with different TableSheetPanel class methods.

// Init a tablesheet panel
var host = document.getElementById("panel");
panel = new GC.Spread.Sheets.TableSheet.TableSheetPanel("myPanel", sheet, host);

// Attach a tablesheet into current tablesheet panel.
panel.attach(tableSheet);
// Detach a tablesheet from current tablesheet panel.
panel.detach();
// Destroy current tablesheet panel.
panel.destroy();

Group Panel

A panel consists of a group area as well. This area allows adding group items, summary items, and slice items.

You can group items by dragging the column items from the field area to the group area. Double-click the caption to modify the caption of the group item.

Similarly, you can remove a group item by dragging it from the group area to any other area, or clicking the remove button in the group item.

Adding Summary and Slice Items

You can create a summary item by clicking the "Add summary item" button and inputting the custom formula. The summary item provides the option to add slice items by inputting the slice field. You can remove the slice by clearing the slice item formula.

Filter Dialog

TableSheet supports Excel-like filter dialog including text, number, and date conditions. It also includes sorting options such as ascending and descending sort.

You can control the visibility of each part in the tablesheet filter dialog if you do not need the checklist or some parts of the filter dialog. To know more about sort and filter, refer to the Sort and Filter topic.

Status Bar

TableSheet supports adding data and custom items in the status bar. Selecting different ranges of cells shows the relevant information in the status bar.

For example, the image below shows a status bar that displays the selected column count in a tablesheet.

To learn how to add custom items to the status bar, refer to Status Bar.

TableSheet supports the context menu in different areas of the view such as viewport or corner, row, and column header.

Each area provides different menu items such as pin/unpin, show/hide, and cut/copy/paste options.

Viewport or Corner

Column Header

Row Header