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)は私の意見では論理的ではないことに注意してくださいが、それを省略すると、クリックする前にlistBoxが表示されません...私はそれを本当に理解していません...誰かが知っていますか?

EDIT2：おっと、私はなんてばかげているのですかsetVisible(false)、listBoxを作成するときにあなたが追加したことに気づきませんでした;-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 に答える