Page tree

Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

You can use a combo box cell to display a drop-down list.
Image Removed
You can also make the combo cell editable. You can type in the edit portion of the cell and the matching item in the list is selected automatically.
Image Removed
If the item width is less than the cell width, then the item width is set to the cell width; otherwise, the item width is equal to the width of the longest item.
The maximum number of visible items in the drop-down list is 20. Use the up or down arrow keys to select items when the drop-down list is displayed. The left and right arrow keys commit the selected item and move to the next or previous cell. The Enter key also commits the selected item and the Esc key cancels the selected item.
The arrow keys may not behave the same when using rapid input mode. If the cell's editor status is EditorStatus.Enter, pressing the left or right arrow key ends editing and navigates to the previous or next cell. If the editor status is EditorStatus.Edit, pressing the left or right arrow key does not end editing.
Using Code
The following example creates a combo box cell with a list of items.你可以在单元格中使用一个组合框用于显示下拉可选择的列表。

Image Added

组合框也可以设置为可编辑的,并且可以是自动匹配的。你可以在输入部分输入文字,下拉列表中将会显示与输入内容最相近的项目。
Image Added

如果组合框项目的宽度小于单元格的宽度,组合框的下拉列表将会设为和单元格一样宽;否则,组合框下拉列表的宽度取决于最长项目的宽度。

下拉列表最多能显示 20 个条目,使用键盘上的上方向键和下方向键来滚动显示区域。按键盘上的左方向键和右方向键来确认当前的选择,并移动到上一个或者下一个单元格。回车键也可以用于确认选择。Esc 键取消当前的操作,并关闭组合框。

导航键的行为在快速输入模式下表现的不太一样。如果单元格编辑器的状态为 EditorStatus.Enter,按下键盘上的左方向键和右方向键将会移动到上一个单元格或者下一个单元格。如果单元格编辑器的状态为 EditorStatus.Edit,按下键盘上的左方向键和右方向键将不会退出编辑模式。

示例代码

以下代码创建了一个组合框,组合框将弹出一个下拉列表,

JavaScript

Copy Code

<ac:structured-macro ac:name="unmigrated-wiki-markup" ac:schema-version="1" ac:macro-id="308e7741-d092-4717-91d6-f4fe29e58e81"><ac:plain-text-body><![CDATA[

var cellType2 = new GC.Spread.Sheets.CellTypes.ComboBox();cellType2.items(["a","b","c"]);activeSheet.getCell(2, 2).cellType(cellType2);

 

]]></ac:plain-text-body></ac:structured-macro>

The following example creates an editable combo box cell with a list of items.以下代码创建了一个可编辑的组合框,组合框将会弹出一个下拉列表。

JavaScript

Copy Code

<ac:structured-macro ac:name="unmigrated-wiki-markup" ac:schema-version="1" ac:macro-id="6a58a696-e032-4a1f-99c6-c39e49092943"><ac:plain-text-body><![CDATA[

var items2 = ["a", "ab", "abc", "apple", "boy", "cat", "dog"];var eComboBoxCellType = new GC.Spread.Sheets.CellTypes.ComboBox().items(items2).editable(true); activeSheet.getCell(1, 3).cellType(eComboBoxCellType);activeSheet.setColumnWidth(3,120);

 

]]></ac:plain-text-body></ac:structured-macro>

See Also另见
Using Rapid Input Mode
Using Edit Mode Always
ComboBox class