2

GAS でシンプルな UI Web フォームをコーディングしています。いくつかのテキスト ボックスとリスト ボックスがあります。ぼかしのテキスト ボックスの入力を検証するクライアント ハンドラーを追加しましたが、すべて正常に動作します。ただし、リスト ボックスでクライアント ハンドラを使用しようとすると、機能しません。たとえば、リスト ボックスの最初の項目が空の文字列で、項目が選択されていることを確認したいとします。私が使用する検証オプションが何であれ、起動します。長さを検証してみました。おそらくスクリプトがリストのインデックス値を取得しているのではないかと思ったので、オプションと範囲を試しました。また、ノーゴー。スクリプトは、検証を短絡している null 値で動作していると思います。任意のヒント?ウィジェットがリスト ボックスの場合、このことは条件に関係なく常に起動します。

var required_field = app.createClientHandler()
  .validateNotLength(widget, min, max)
  .forTargets(lblInfo)
  .setStyleAttribute('color','red')
  .setText('Please correct errors in red NOW.')
  .forTargets(lbl)
  .setStyleAttribute('color','red')
  .forTargets(widget)
  .setStyleAttribute('background', '#ffe7e7');
widget.addBlurHandler(required_field);
4

2 に答える 2

1

クライアントハンドラーはListBoxでは機能しません。ただし、サーバーハンドラーには常にオプションがあり、反応が1〜2秒遅れる可能性があるほとんどの場合に適用できることを忘れないでください。

于 2012-07-09T12:31:43.917 に答える
1

私はこの問題に興味を持っていたので、いくつかのテストを実行したところ、興味深い回避策が見つかりました。コードは少し長いですが、短くして明確にする方法が見つかりませんでした;-)

このバージョンは機能しています。「透明」にする方法と、リストボックスでハンドラーの検証が機能しないことを示す方法を提案するコメントがいくつかあります。

あなたの考えを教えてください;-)

編集:簡単なテストのためにバージョンをオンラインにしました。

 function showtest() {
   var doc = SpreadsheetApp.getActiveSpreadsheet();
   var app = UiApp.createApplication().setTitle('ListBox Clienthandler test');
   var panel = app.createVerticalPanel();
   var lb = app.createListBox(false).setId('myId').setName('myLbName').setWidth(350);
   var former = app.createTextBox().setName('former value').setId('former').setWidth(350);
   var textbox = app.createTextBox().setName('text').setId('valtext').setWidth(350)//.setVisible(false);// set it visible to test how it works, invisible to use it 'transparently'
   var label = app.createHTML("<BR><BR>Use this textBox as a button, click on it to update its value,<BR>the Client handler doesn't fire when selected color = white<BR>(if you set the upper textBox invisible then it works as if the<BR>listBox had the handler)<BR><BR>")    
   // add items to ListBox
   lb.setVisibleItemCount(7);
   lb.addItem('white');
   lb.addItem('pink');
   lb.addItem('orange');
   lb.addItem('green');
   lb.addItem('yellow');
   lb.addItem('red');
   lb.addItem('cyan');
//  
   panel.add(textbox);
   panel.add(lb);
   panel.add(label);
   panel.add(former);
   var handler = app.createServerClickHandler('click').addCallbackElement(panel);
   lb.addClickHandler(handler);
   app.add(panel);
   doc.show(app);
 }
//
function click(e) {
   var app = UiApp.getActiveApplication();
   var value = e.parameter.myLbName
       if(value==''){value='white'}
   var textboxvalue = e.parameter.text
       if(textboxvalue==''){textboxvalue='none'}
   var text=app.getElementById('valtext')
       text.setText(value)
   var lb=app.getElementById('myId')
   var former=app.getElementById('former')
//   var handlerval = app.createClientHandler().validateNotMatches(lb, 'white') // this line puts handler on listBox and doesn't work
   var handlerval = app.createClientHandler().validateNotMatches(text, 'white')  // this line puts handler on TextBox and works as expected
     .forEventSource().setText("Click here for Former Value = "+textboxvalue+" / present value = "+value)
     .forTargets(lb).setStyleAttribute("background", value)
      former.addClickHandler(handlerval);   
   return app;
 }

編集2:

必要な機能を(ほぼ正確に)シミュレートする別の可能性があります:(オンライン版

     function showtest() {
       var doc = SpreadsheetApp.getActiveSpreadsheet();
       var app = UiApp.createApplication().setTitle('ListBox Clienthandler test');
       var panel = app.createVerticalPanel();
       var lb = app.createListBox(false).setId('lb').setName('lb').setWidth(350);
       var label = app.createHTML("<BR>You forgot to choose a value in the list").setVisible(false).setId('label');
       lb.setVisibleItemCount(7);
       lb.addItem('');
       lb.addItem('pink');
       lb.addItem('orange');
       lb.addItem('green');
       lb.addItem('yellow');
       lb.addItem('red');
       lb.addItem('cyan');
       var othertextbox = app.createTextBox().setText('other question');
       var grid = app.createGrid(4,1)
           grid.setWidget(0, 0, lb)
           grid.setWidget(1, 0, label)
           grid.setWidget(3, 0, othertextbox)
       panel.add(grid)
       var handler = app.createServerBlurHandler('alert').addCallbackElement(panel);
       lb.addBlurHandler(handler);
       app.add(panel);
       doc.show(app);
     }
    //
function alert(e) {
   var app = UiApp.getActiveApplication();
   var lb = app.getElementById('lb')
   var label = app.getElementById('label')
   var value = e.parameter.lb
       if(value==''){
  lb.setStyleAttribute("background", 'red');
         label.setVisible(true)
           }else{
  lb.setStyleAttribute("background", 'white');
         label.setVisible(false)
           }
   return app;
于 2012-07-08T11:02:38.337 に答える