The SpreadJS Designer allows you to create basic cell types quickly and without code. You can create button, check box, combo box, and hyperlink cells in the SpreadJS Designer. The options for setting the cell type are located under the Home tab. Designer Select this icon for the button cell: Select this icon for the check box cell: Select this icon for the combo box cell: Select this icon for the hyperlink cell: The Button CellType dialog has the following options: Button CellType Dialog
Option
Description
Margin: Left, Top, Right, and Bottom
Specifies the margin in pixels in the cell.
BackColor
Specifies the background color for the button cell.
Text
Specifies the text in the button cell.
The CheckBox CellType dialog has the following options: CheckBox CellType Dialog
Option
Description
True
Specifies the value when the cell is checked.
Indeterminate
Specifies the value when the cell is null.
False
Specifies the value when the cell is unchecked.
Align
Specifies the text alignment relative to the check box.
Caption
Specifies a caption for the cell. This text is displayed if True, False, or Indeterminate is not set.
IsThreeState
Specifies whether the check box uses True and False or True, Indeterminate, and False.
The ComboBox CellType dialog has the following options: ComboBox CellType Dialog
Option
Description
EditorValueType
Gets or sets the value (text, value, or index) that is written to the underlying data model.
Items Height
Specifies the height of each item.
Editable
Specifies whether the combo box is editable.
Items
Specifies the list of items for the combo box. Use the Add or Remove buttons to add or remove items to the list.
Text
Specifies the item text.
Value
Specifies the item value.
The EditorValueType option has the following settings:
EditorValueType Option
Description
Index
Writes the index of the selected item to the model.
Text
Writes the text value of the selected item to the model.
Value
Writes the corresponding data value of the selected item to the model.
The HyperLink CellType dialog has the following options: HyperLink CellType Dialog
Option
Description
Link
Specifies the color of the hyperlink.
VisitedLink
Specifies the color of the hyperlink after it has been selected.
Text
Specifies the text displayed in the hyperlink.
LinkToolTip
Specifies a tooltip for the hyperlink.
Type the hyperlink value in the cell and then set the hyperlink cell type. The cell value is used for the hyperlink URL. The following image displays a column of button, check box, combo box, and hyperlink cells in the designer. SpreadJS Designer Example