Страницы

пятница, 20 декабря 2013 г.

GAS UI Service. Из одного виджета в другой.

Недавно ко мне обратились с вопросом по Google Apps Script: как получить информацию из одного виджета и записать в другой. Настоящим постом хочу прояснить ситуацию с обработкой событий виджетов UI Service на сервере. По-моему следующий пример наглядно демонстрирует предмет, а исходный код с комментариями не требует дополнительных пояснений.

function doGet() {
  var app = UiApp.createApplication();
  var v = app.createVerticalPanel().setStyleAttribute('margin', '20px');
  
  // обращаем внимание, что первому элементу присвоено имя - setName('t1'), 
  // а второму id - setId('t2')
  var t1 = app.createTextArea().setName('t1').setWidth(300).setFocus(true);
  var t2 = app.createTextArea().setId('t2').setWidth(300);
  v.add(t1).add(t2); //добавляем виджеты на вертикальную панель
  
  // создаем функцию-обработчик события
  var handler = app.createServerHandler('onKeyUp');
  // добавляем функцию обратного вызова, а в нее элемент - вертикальную панель, 
  // которая содержит интересующий нас элемент t1,
  // можно было сразу добавить элемент t1
  handler.addCallbackElement(v);
  // добавляем элементу функцию-обработчик события нажатия на кнопку клавиатуры
  t1.addKeyUpHandler(handler);
  
  // можно было записать в одну строку:
  //t1.addKeyUpHandler(app.createServerHandler('onKeyUp').addCallbackElement(v));
  
  app.add(v);
  return app;
}

function onKeyUp(e) {
  var app = UiApp.getActiveApplication();
  var t2 = app.getElementById('t2'); // здесь играет 'id'
  t2.setText(e.parameter.t1); // здесь играет 'name'
  return app;
}

Для тех, кто в танке: пишем в верхнее поле, получаем данные в нижнее.