[]
Sheets.TableSheet.TableSheet
TableSheet
• new TableSheet(name?
, dataView?
, options?
)
Represents a table sheet with the specified name, data view and options setting.
example
//This example creates a empty TableSheet.
var tableSheet = spread.addSheetTab(0, "", GC.Spread.Sheets.SheetType.tableSheet);
//This example creates a TableSheet with name.
var tableSheet = spread.addSheetTab(0, "tableSheet1", GC.Spread.Sheets.SheetType.tableSheet);
//This example creates a TableSheet with name and data source.
var dataManager = spread.dataManager();
var myTable = dataManager.addTable("myTable", {
remote: {
read: {
url: 'https://demodata.mescius.io/northwind/api/v1/Orders'
}
}
});
myTable.fetch().then(function() {
var myView = myTable.addView("myView");
var tableSheet = spread.addSheetTab(0, "tableSheet1", GC.Spread.Sheets.SheetType.tableSheet);
tableSheet.setDataView(myView);
});
//This example creates a TableSheet with name and options.
var style = new GC.Spread.Sheets.Style();
var tableSheet = spread.addSheetTab(0, "tableSheet1", GC.Spread.Sheets.SheetType.tableSheet);
tableSheet.options = {allowAddNew: false, alternatingRowOptions: { step: [1, 1], style: style}};
Name | Type |
---|---|
name? |
string |
dataView? |
View |
options? |
ITableSheetOptions |
• options: ITableSheetOptions
Represents the options of the table sheet.
property
[allowAddNew] - Whether to allow to add new empty row.
property
[sheetTabColor] - A color string used to represent the sheet tab color, such as "red", "#FFFF00", "rgb(255,0,0)", "Accent 5", and so on.
property
[alternatingRowOptions] - Defines the alternating row style options.
property
[defaultStackRowHeight] - Tablesheet default stack row height, will calculate the average height by default.
property
[menuItemVisibility] - Tablesheet default stack row height, will calculate the average height by default.
property
[showRowNumber] - Whether to show the row number header.
property
[enableDefineColumn] - Whether to enable defining column.
property
[defineColumnCommand] - Specify the command for defining column options.
property
[submitDefineColumnCommand] - Specify the command for submitting defined column options.
property
{GC.Spread.Sheets.TableSheet.IColumnTypeItem[]} [columnTypeItems] - Specify the column types.
property
[groupLayout] - Specify the options for group layout.
example
//This example changes a TableSheet's options.
tableSheet.options.allowAddNew = false;
tableSheet.options.alternatingRowOptions = { step: [1, 1], style: new GC.Spread.Sheets.Style("lightyellow")};
▸ addHierarchyItemAbove(row
, rowData
): void
Add a new row data as the parent of the specified row.
example
//This example adds a new row data as the parent of the specified row.
tableSheet.addHierarchyItemAbove(8, {id: 8, name: "spreadjs"});
Name | Type | Description |
---|---|---|
row |
number |
The row index. |
rowData |
any |
The row data. |
void
▸ addHierarchyItemAfter(row
, rowData
): void
Add a new row data after the specified row.
example
//This example adds a new row data after the specified row.
tableSheet.addHierarchyItemAfter(8, {id: 8, name: "spreadjs"});
Name | Type | Description |
---|---|---|
row |
number |
The row index. |
rowData |
any |
The row data. |
void
▸ addHierarchyItemBefore(row
, rowData
): void
Add a new row data before the specified row.
example
//This example adds a new row data before the specified row.
tableSheet.addHierarchyItemBefore(8, {id: 8, name: "spreadjs"});
Name | Type | Description |
---|---|---|
row |
number |
The row index. |
rowData |
any |
The row data. |
void
▸ addHierarchyItemBelow(row
, rowData
): void
Add a new row data as the child of the specified row.
example
//This example adds a new row data as the child of the specified row.
tableSheet.addHierarchyItemBelow(8, {id: 8, name: "spreadjs"});
Name | Type | Description |
---|---|---|
row |
number |
The row index. |
rowData |
any |
The row data. |
void
▸ addRow(rowData
): void
Adds a new row to table sheet.
example
//This example adds a new row with data.
tableSheet.addRow({id: 8, name: "spreadjs"});
Name | Type | Description |
---|---|---|
rowData |
any |
The row data. |
void
▸ applyFreeHeaderArea(sheetJson?
): any
Applies a Worksheet JSON to a TableSheet column header free layout area.
Name | Type | Description |
---|---|---|
sheetJson? |
any |
a Worksheet JSON, which can be gotten easily by Worksheet's toJSON method. |
any
▸ applyTableTheme(tableTheme
): void
Applies a table theme to current TableSheet.
Name | Type | Description |
---|---|---|
tableTheme |
TableTheme |
A table theme instance. |
void
▸ cancelChanges(): void
Cancels the changes of data manager in batch mode.
example
//This example cancel changes manually in batch mode.
tableSheet.cancelChanges();
void
▸ collapseAllHierarchyLevels(): void
Collapse the all hierarchy levels.
example
//This example collapse the all hierarchy levels.
tableSheet.collapseAllHierarchyLevels();
void
▸ demoteHierarchyLevel(row
, withChildren?
): void
Demote the hierarchy data level of the specified row.
example
//This example demote the hierarchy data level by specified index.
tableSheet.demoteHierarchyLevel(8);
Name | Type | Description |
---|---|---|
row |
number |
The row index. |
withChildren? |
boolean |
Optional, the children will be demoted with the record by default. |
void
▸ detailColumnsVisible(value?
): boolean
Whether to show or hide the detail columns after Table Sheet is grouped.
example
//This sample shows how to hide the detail columns.
tableSheet.detailColumnsVisible(false);
Name | Type | Description |
---|---|---|
value? |
boolean |
A boolean value which indicates the visibility of the detail columns. |
boolean
Returns the visibility of the detail columns.
▸ expandAllHierarchyLevels(): void
Expand the all hierarchy levels.
example
//This example expand the all hierarchy levels.
tableSheet.expandAllHierarchyLevels();
void
▸ expandGroup(field
, expand
): void
Expands or collapses one level grouping by the specified field.
example
//This sample shows how to collapse one level grouping, which is grouped by "LastName".
tableSheet.expandGroup("LastName", false);
Name | Type | Description |
---|---|---|
field |
string |
The field name. |
expand |
boolean |
A boolean value, true means expanding the grouping, false means collapsing the grouping. |
void
▸ expandGroupItem(level
, index
, expand
): void
Expands or collapses one grouping by the specified level and index.
example
//This sample shows how to collapse one grouping, which level is 1 and start index is 10.
tableSheet.expandGroupItem(1, 10, false);
Name | Type | Description |
---|---|---|
level |
number |
The grouping level. |
index |
number |
The grouping start index. |
expand |
boolean |
A boolean value, true means expanding the grouping, false means collapsing the grouping. |
void
▸ expandHierarchyLevel(level
): void
Expand the hierarchy data by specified level.
example
//This example expand the hierarchy data by specified level.
tableSheet.expandHierarchyLevel(8);
Name | Type | Description |
---|---|---|
level |
number |
The level to expand. |
void
▸ getChanges(): IDataViewChanges
[]
Gets the changes of data manager in autoSync or batch mode.
example
//This example get changes manually in autoSync or batch mode, including updated rows, inserted rows, deleted rows, add column, update column, remove column.
tableSheet.getChanges();
Returns a object array, each object could contain "type", "dataItem", "oldDataItem", "column", "originalColumn", and "index". The "type" is the change type, could be one of "insert", "update", "delete", "addColumn", "updateColumn", "removeColumn". the "dataItem" is the current row data. The "oldDataItem" is the original row data, only used for "update". The "column" is the current column. The "data" is the default value of the current added column. The "originalColumn" is the original column, only used for "update column". The "index" is the view index of table sheet.
▸ getDataView(): View
Gets the data view of table sheet.
example
//This example gets the data source.
tableSheet.getDataView();
Returns the data view.
▸ groupBy(options?
): IGroupByOptions
[]
group the table sheet by options
example
//This example sets group options and group the table sheet.
tablesheet.groupBy([
{
caption: 'Category',
field: 'category',
summaryFields:[
{
caption: 'SUM(Quantity)', width: 120, style: { formatter: "$ #,##0.00" }
formula: '=SUM([Quantity])',
slice: 'Office'
}
]
}
])
Name | Type | Description |
---|---|---|
options? |
IGroupByOptions [] |
The options of the groupBy |
▸ groupOutlinePosition(value?
): boolean
Whether to show or hide the grouping outline in viewport area and column header area, or row header area after Table Sheet is grouped.
example
//This sample shows how to hide the grouping outline.
tableSheet.groupOutlinePosition(GC.Spread.Sheets.TableSheet.GroupOutlinePosition.none);
Name | Type | Description |
---|---|---|
value? |
GroupOutlinePosition |
A value which indicates the position of the grouping outline. |
boolean
Returns the position of the grouping outline.
▸ hasRowState(type
, row
): boolean
Judges the row with the specified state.
example
//This example judges the row with the specified state.
tableSheet.hasRowState(GC.Data.RowColumnStates.selected, 0);
Name | Type | Description |
---|---|---|
type |
RowColumnStates |
The type of row states. |
row |
number |
The row index. |
boolean
▸ moveDown(row
): void
Move the hierarchy data by the specified row down.
example
//This example move the hierarchy data by specified index down.
tableSheet.moveDown(8);
Name | Type | Description |
---|---|---|
row |
number |
The row index. |
void
▸ moveUp(row
): void
Move the hierarchy data by the specified row up.
example
//This example move the hierarchy data by specified index up.
tableSheet.moveUp(8);
Name | Type | Description |
---|---|---|
row |
number |
The row index. |
void
▸ printInfo(value?
): any
Gets or sets the print information for the table sheet.
example
//This example sets print info.
var printInfo = tableSheet.printInfo();
printInfo.bestFitRows(true);
printInfo.bestFitColumns(true);
tableSheet.printInfo(printInfo);
Name | Type |
---|---|
value? |
PrintInfo |
any
If no value is set, returns the print information for the table sheet; otherwise, returns the table sheet.
▸ promoteHierarchyLevel(row
): void
Promote the hierarchy data level of the specified row.
example
//This example promote the hierarchy data level by specified index.
tableSheet.promoteHierarchyLevel(8);
Name | Type | Description |
---|---|---|
row |
number |
The row index. |
void
▸ removeGroupBy(): void
remove group status of the table sheet
example
//This example shows removing the group status of the table sheet.
tablesheet.removeGroupBy()
void
▸ removeRow(row
): void
Removes the specified row from table sheet.
example
//This example removes a row by specified index.
//The changes will be synchronized when the autoSync be true.
tableSheet.removeRow(8);
Name | Type | Description |
---|---|---|
row |
number |
The row index. |
void
▸ resetRow(row
): void
Resets the changes of the specified row of table sheet.
example
//This example resets a row by specified index.
tableSheet.resetRow(8);
Name | Type | Description |
---|---|---|
row |
number |
The row index. |
void
▸ rowActionOptions(options?
): IRowActionOptions
[]
Gets or sets the options of the row action.
example
//This example set the options of the row action.
let options = tableSheet.rowActionOptions();
options.push({
icons: ["./comment.png"],
iconSelector: (item) => {
return item.comment && item.comment.length > 0;
}
});
tableSheet.rowActionOptions(options);
Name | Type | Description |
---|---|---|
options? |
IRowActionOptions [] |
The options of the row action. |
▸ saveRow(row
): void
Saves the changes of the specified row of table sheet to data manager, including updated row or and inserted row.
example
//This example saves a row by specified index.
//The changes will be synchronized when the autoSync be true.
tableSheet.saveRow(8);
Name | Type | Description |
---|---|---|
row |
number |
The row index. |
void
▸ setDataView(dataView
): void
Sets the data view of table sheet.
example
//This example sets the data source.
var dataManager = spread.dataManager();
var myTable = dataManager.addTable("myTable", {
remote: {
read: {
url: 'https://demodata.mescius.io/northwind/api/v1/Orders'
}
}
});
myTable.fetch().then(function() {
var myView = myTable.addView("myView");
tableSheet.setDataView(myView);
});
Name | Type | Description |
---|---|---|
dataView |
View |
The data view to bind. |
void
▸ setDefaultRowHeight(value
, sheetArea?
): void
Sets the default height in pixels for the all rows in the viewport area.
example
//This example sets the default row height in pixels.
tableSheet.setDefaultRowHeight(50);
Name | Type | Description |
---|---|---|
value |
number |
The height in pixels. |
sheetArea? |
SheetArea |
- |
void
▸ submitChanges(): void
Submits the changes of data manager to server in batch mode, including updated rows, inserted rows and deleted rows.
example
//This example submit changes manually in batch mode.
tableSheet.submitChanges();
void
▸ togglePinnedColumns(index
): void
Pin or unpin columns with specified column index array.
example
//This example pin several columns.
tableSheet.togglePinnedColumns([1,2,4]);
Name | Type | Description |
---|---|---|
index |
number [] |
The array of column indexes to do pin or unpin. |
void
Returns the count of the pinned columns.
▸ togglePinnedRows(indexes
): void
Pin or unpin rows with specified row index array.
example
//This example pin several rows.
tableSheet.togglePinnedRows([1,2,4]);
Name | Type |
---|---|
indexes |
number [] |
void
Returns the count of the pinned rows.