Question

我在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);

Answer 1

我对这个问题很感兴趣所以我进行了几次测试，最后得到了一个可能很有趣的解决方法。代码有点长，但我没有找到任何方法让它变短并且仍然清晰; - ）

此版本正常运行，有一些评论建议如何使其“透明”，以及如何证明处理程序验证在listBox上不起作用。

告诉我你的想法; - ）

编辑：我已经安排version online进行快速测试。

 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：

这是另一种模拟（几乎确切）所需功能的可能性：（online version）

     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;

Answer 2

客户端处理程序不适用于ListBox。但是不要忘记，你总是有一个服务器处理程序选项，适用于大多数情况下，你可以在1-2秒内反应迟到

列表框上的GAS客户端处理程序验证

2 个答案: