Question

我想根据特定条件动态地向tabPanel添加标签有时用户将有3个选项卡，另一次他（或另一个用户）可能有多达10个选项卡。每次添加的标签顺序也可能不同。
所以我希望能够通过id而不是索引来识别选项卡。

将多个标签添加到tabPanel后，您可以按

选择标签

tabPanel.selectTab(2);    // Will select third tab of the tabPanel

使用selectionHandler我可以识别tabPanel和所选标签的索引

var onSelectHandler = app.createServerHandler('onSelectHandler');
tabPanel.addSelectionHandler(onSelectHandler)

...

function onSelectHandler(e)
{
   var source    = e.parameter.source;   // Id of the tabPanel
   var indexTab  = e.parameter[source];  // Index of the tab selected
}

但我无法了解如何选择所选标签的 id ，也无法按ID选择标签。

除了隐藏字段和其他技巧之外，有没有办法通过Id识别标签？

Answer 1

单个选项卡没有ID，只有TabPanels有ID。 TabPanel有多个选项卡。

但是，您可以通过setTag（）和JSON传递有关TabPanel的任意信息。

例如：

function doGet() {
  var app = UiApp.createApplication();
  var clickHandler = app.createServerHandler('myClickHandler');
  var tab = app.createTabPanel().setId('asdf');

  var fooLabel = app.createLabel('I am foo.').setId('fooId');
  var barLabel = app.createLabel('I am bar.').setId('barId');
  var tag = [];

  tab.add(fooLabel, 'Foo');
  tag.push(fooLabel.getId());

  tab.add(barLabel, 'Bar');
  tag.push(barLabel.getId());

  tab.addSelectionHandler(clickHandler);
  tab.setTag(JSON.stringify(tag));

  app.add(tab);
  return app;
}

function myClickHandler(e) {
  var app = UiApp.getActiveApplication();
  var tag = JSON.parse(e.parameter[e.parameter.source + '_tag']);
  var id = tag[e.parameter[e.parameter.source]];
  Logger.log(id);
  return app;
}

单击名为Foo和Bar的结果选项卡，然后检查您的日志。

但请注意，每次单击标题时都会发生这种情况，即使它已经是选中的标题。请谨慎使用。

我很好奇：你打算在回调中使用这些信息做什么？

您是否期望动态更新面板内容，当标签显示时显示当前数据？或者当时使用小部件填充面板？

使用GAS选择后，在tabPanel中标识选项卡

1 个答案: