- SpreadJS Overview
- Getting Started
- JavaScript Frameworks
- Best Practices
-
Features
- Workbook
- Worksheet
- Rows and Columns
- Headers
- Cells
- Data Binding
- TableSheet
- GanttSheet
- JSON Schema with SpreadJS
- SpreadJS File Format
- Data Validation
- Conditional Formatting
- Sort
- Group
- Formulas
- Serialization
- Keyboard Actions
- Shapes
- Form Controls
- Floating Objects
- Barcodes
- Charts
- Sparklines
- Tables
- Pivot Table
- Slicer
- Theme
- Culture
- SpreadJS Designer
- SpreadJS Designer Component
- Touch Support
- Formula Reference
- Import and Export Reference
- Frequently Used Events
- API Documentation
- Release Notes
Create Tables
You can display data in a table in the control. The table has options to filter or sort the data.
The default table style is medium2.
SpreadJS provides the following methods for different kinds of customizations:
Control whether to display the table header and footer by setting the showHeader and showFooter methods.
Control whether to highlight the first or last column by setting the highlightFirstColumn or highlightLastColumn method.
Control whether to show banded rows and columns by setting the bandRows or bandColumns method.
Customize the table style with the TableStyle class, headerRowStyle method, and the footerRowStyle method.
Set the header cell text and the footer cell text and formula.
The row count for the table includes the header and footer rows. Tables support frozen rows and columns, sparklines, and cell spans.
The following code sample creates a table and sets the table style.
activeSheet.tables.add("Table1", 0, 0, 3, 3, GC.Spread.Sheets.Tables.TableThemes.dark1);
activeSheet.getCell(0,0).text("Name");
activeSheet.getCell(0,1).text("Value");
activeSheet.getCell(0,2).text("T/F");
activeSheet.getCell(1,0).text("AW");
activeSheet.getCell(1,1).text("5");
activeSheet.getCell(1,2).text("T");