1

我想知道如何设置“blocksPanel”和“briquettesPanel”可见或不可见？如果在下拉列表中选择了“8:1 Compressed Blocks”，我希望“blocksPanel”可见，如果在下拉列表中选择“8:1 Compressed Briquettes”，则“briquettesPanel”可见。

function doGet(e) {
  var app = UiApp.createApplication();

  //Create horizontal product + other panel
  var productOtherPanel = app.createHorizontalPanel().setId('productOtherPanel')
  .setStyleAttribute('position','relative').setStyleAttribute('left','0%');

  //Create horizontal Product Panel  
  var productPanel = app.createHorizontalPanel().setId('productPanel').setStyleAttribute('position','relative')
  .setStyleAttribute('left','0%').setVisible(true);
  //Create listBox
  var productList = app.createListBox().setName("productList").setId('productList');
  //Add items to listBox
  productList.addItem("8:1 Compressed Blocks");
  productList.addItem("8:1 Compressed Briquettes");

  //Create horizontal Compressed Blocks panel
  var blocksPanel = app.createHorizontalPanel().setId('blocksPanel')
  .setStyleAttribute('position','relative').setStyleAttribute('left','0%').setVisible(true);
  //Create Compressed Blocks Size List
  var blocksSizeList = app.createListBox().setName('blocksSizeList').setId('blocksSizeList');
  //addItem fills the Compressed Blocks Size List
  blocksSizeList.addItem("5kg");
  blocksSizeList.addItem("20kg");

  //Create horizontal Briquettes panel
  var briquettesPanel = app.createHorizontalPanel().setId('briquettesPanel')
  .setStyleAttribute('position','relative').setStyleAttribute('left','0%').setVisible(true);
  //Create Briquettes Size List
  var briquettesSizeList = app.createListBox().setName('briquettesSizeList').setId('briquettesSizeList');
  //addItem fills the Briquettes Size List
  briquettesSizeList.addItem("250g");
  briquettesSizeList.addItem("650g");




  app.add(productOtherPanel);
  productOtherPanel.add(productPanel);
  productPanel.add(productList);

  productOtherPanel.add(blocksPanel);
  blocksPanel.add(blocksSizeList);

  productOtherPanel.add(briquettesPanel);
  briquettesPanel.add(briquettesSizeList);


  return app;
}
4

1 回答 1

3

首先为产品列表创建一个服务器更改处理程序。

var handler = app.createServerHandler("panelHandler");
productList.addChangeHandler(handler);

然后定义面板处理函数如下。productList 被传递到处理函数的“event”参数中。

function panelHandler(event) {
  var app = UiApp.getActiveApplication();
  if (event.parameter.productList == "8:1 Compressed Blocks") {
    app.getElementById('blocksPanel').setVisible(true);
    app.getElementById('briquettesPanel').setVisible(false);
  }
  else if (event.parameter.productList == "8:1 Compressed Briquettes") {
    app.getElementById('blocksPanel').setVisible(false);
    app.getElementById('briquettesPanel').setVisible(true);
  }
  return app;
}

一开始需要设置 blocksPanel 可见和 briquettesPanel 不可见，以匹配产品列表的初始状态。

有关更多信息，请参阅服务器处理程序文档。

于 2012-11-26T05:55:03.990 回答