1

我正在尝试使用复选框来切换某些小部件的可见性。但是，我真的很难让客户端处理程序正确切换它们。

这是我最好的尝试

编辑：完全可重现的例子

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

  var checkbox = app.createCheckBox("Toggle Visiblity").setName("togglebox").setId("togglebox");
  app.add(checkbox);
  var listBox = app.createListBox(true)
    .addItem("Item #1")
    .addItem("Item #2")
    .addItem("Item #3")
    .setVisible(false);
  app.add(listBox);

   checkbox.addValueChangeHandler(app.createClientHandler()
                                        .validateMatches(checkbox, "on")
                                        .forTargets(listBox)
                                        .setVisible(true));
  checkbox.addValueChangeHandler(app.createClientHandler()
                                        .validateMatches(checkbox, "off")
                                        .forTargets(listBox)
                                        .setVisible(false));

  return app;
}

理论上它应该可以工作，但是当我切换复选框时没有任何反应。我已经尝试了几个不同的值，有和没有“i”标志，但都没有奏效。

在不使用服务器端处理程序的情况下，是否有人对如何执行此操作有任何建议？

4

1 回答 1

1

这正在使用 Henrique在以前的帖子中建议的“隐形技巧”

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

  var checkbox = app.createCheckBox("Toggle Visiblity").setName("togglebox").setId("togglebox").setValue(true);
  var checkbox2 = app.createCheckBox("Toggle Visiblity").setVisible(false);
  var hpanel = app.createHorizontalPanel();
  hpanel.add(checkbox).add(checkbox2);
  app.add(hpanel);
  var listBox = app.createListBox(true)
    .addItem("Item #1")
    .addItem("Item #2")
    .addItem("Item #3")
    .setVisible(false);
  app.add(listBox);

 var ChandlerA = app.createClientHandler().forTargets(listBox).setVisible(false)
 .forTargets(checkbox2).setVisible(true).setValue(false)
 .forEventSource().setVisible(false);
  checkbox.addClickHandler(ChandlerA)
 var ChandlerB = app.createClientHandler().forTargets(listBox).setVisible(true)
 .forTargets(checkbox).setVisible(true).setValue(true)
 .forEventSource().setVisible(false);
  checkbox2.addClickHandler(ChandlerB)

  listBox.setVisible(true);
return app
  }

编辑：请注意，我认为最后一条语句listBox.setVisible(true)不合逻辑，但如果我省略它，则列表框在单击之前不可见......我真的不明白......有人知道吗？

EDIT2：哎呀，我是多么愚蠢，我没有注意到setVisible(false)你在创建列表框时添加的内容；-P 哼哼……我真的很愚蠢……我猜你想开始“隐形”？在这种情况下，将对这段代码进行一些小改动......就像这样（我最终决定展示这两个版本......）

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

  var checkbox = app.createCheckBox("Toggle Visiblity").setName("togglebox").setId("togglebox").setVisible(false);
  var checkbox2 = app.createCheckBox("Toggle Visiblity").setVisible(true).setValue(false);
  var hpanel = app.createHorizontalPanel();
  hpanel.add(checkbox).add(checkbox2);
  app.add(hpanel);
  var listBox = app.createListBox(true)
    .addItem("Item #1")
    .addItem("Item #2")
    .addItem("Item #3")
    .setVisible(false);
  app.add(listBox);

 var ChandlerA = app.createClientHandler().forTargets(listBox).setVisible(false)
 .forTargets(checkbox2).setVisible(true).setValue(false)
 .forEventSource().setVisible(false);
  checkbox.addClickHandler(ChandlerA)
 var ChandlerB = app.createClientHandler().forTargets(listBox).setVisible(true)
 .forTargets(checkbox).setVisible(true).setValue(true)
 .forEventSource().setVisible(false);
  checkbox2.addClickHandler(ChandlerB)

return app
}
于 2012-07-24T18:38:06.320 回答