只在选中ComboBox时显示下拉按钮

收藏 · 2023-10-30 11:58 上传

我们在使用ComboBox下拉框的时候，如果界面上有大量的下拉框，那么就会有很多的黑色小箭头，看起来会有一些不太美观。

image.png707453307.png

那么我们能否在不选中这些单元格情况下将这个下拉框的黑色小箭头隐藏起来呢？

当时是可以的，我们可以通过设置tag来实现这样的需求，具体可以参考以下代码：

  let text = new GC.Spread.Sheets.CellTypes.DataObject();
  sheet.getCell(1, 2, GC.Spread.Sheets.SheetArea.viewport).tag(
JSON.stringify([
   { text: "Oranges", value: "11k" },
   { text: "Apples", value: "15k" },
   { text: "Grape", value: "100k" },
])
  );

  let lastComboCellRow;
  let lastComboCellCol;
  sheet.bind(GC.Spread.Sheets.Events.CellClick, function (sender, args) {
if (lastComboCellRow && lastComboCellCol) {
   sheet
      .getCell(
      lastComboCellRow,
      lastComboCellCol,
      GC.Spread.Sheets.SheetArea.viewport
      )
      .cellType(text);
   lastComboCellRow = undefined;
   lastComboCellCol = undefined;
   return;
}

if (sheet.getCell(args.row, args.col).tag()) {
   if (sheet.getCell(args.row, args.col).cellType()?.typeName == "7") {
      return;
   }

   lastComboCellRow = args.row;
   lastComboCellCol = args.col;

   let newCombo = new GC.Spread.Sheets.CellTypes.ComboBox();
   newCombo
      .items(JSON.parse(sheet.getCell(args.row, args.col).tag()))
      .editorValueType(GC.Spread.Sheets.CellTypes.EditorValueType.text);
   sheet
      .getCell(
      lastComboCellRow,
      lastComboCellCol,
      GC.Spread.Sheets.SheetArea.viewport
      )
      .cellType(newCombo);

   sheet.clearSelection();
   sheet.setSelection(lastComboCellRow, lastComboCellCol, 1, 1);
}
  });

最终效果如下：

3.gif110184325.png

		自动登录	找回密码
密码			立即注册

只在选中ComboBox时显示下拉按钮

0 个回复

SpreadJS 认证

SpreadJS 高级认证