Пользовательский интерфейс скрипта Google — чтение и отправка из электронной таблицы, ссылка на заполненный пользовательский интерфейс

Я создал пользовательский интерфейс, который я хотел бы использовать для чтения и публикации в таблица. Пожалуйста, пока игнорируйте форматирование ссылки в столбце A. Сейчас это ссылка на форму. Вместо этого я хочу использовать пользовательский интерфейс и удалю ссылки на связанную форму, как только я это настрою.

Текущий интерфейс.

Я хотел бы, чтобы конечный результат был следующим: 1. При отправке новой записи менеджеры получают электронное письмо со ссылкой.

1. Эта ссылка откроет пользовательский интерфейс.

2. Верхняя (серая) область будет заполнена соответствующими значениями из электронной таблицы на основе идентификационного номера (столбец A).

3. Нижняя область будет пустой или заполнена соответствующими значениями из электронной таблицы, если они существуют.

4. Пользователь заполнит нижнюю область по мере необходимости и отправит.

5. Данные, которые были введены в пользовательский интерфейс, заполнят электронную таблицу в правильных столбцах.

6. Пользователь, просматривающий электронную таблицу, сможет щелкнуть идентификационный номер, и он откроет заполненный пользовательский интерфейс.

Это довольно просто с помощью форм, но я ищу что-то более гибкое, поэтому я использую пользовательский интерфейс.

Вот мои проблемы: 1. Я не могу найти простой и понятный сценарий, который может искать значение и, как только это значение будет найдено, получить остальные данные в строке, содержащей это значение. ◦ Я искал это как сумасшедший, и у всех, кажется, разные идеи, но ни одна из них не соответствует тому, что я ищу.

1. Я понимаю, как передавать значения из пользовательского интерфейса в электронную таблицу, но не наоборот.

2. var formUrl = formResponse.toPrefilledUrl(); работать с пользовательским интерфейсом так же, как и с формами? Если нет, как мне создать ссылку на предварительно заполненный пользовательский интерфейс?

Код пользовательского интерфейса приведен ниже. Да, я знаю, что пользовательский интерфейс сейчас уродлив.

Любая помощь очень ценится! Я все еще чертовски новичок в этом, но каждый день узнаю что-то новое.

function doGet(e) {
  var complaintApp = UiApp.createApplication().setTitle("Complaint Follow-Up").setWidth(1100).setHeight(1000);
  //For pre-populating  
  var prePanel = complaintApp.createAbsolutePanel().setWidth('100%').setStyleAttributes({background: 'D8D8D8'})

  var infoGrid = complaintApp.createGrid(2, 6).setStyleAttributes({fontWeight: "bold", }).setWidth('100%');
  var idNum = complaintApp.createLabel('Complaint ID #:').setStyleAttributes({textAlign: 'right', float: 'left'});
  infoGrid.setWidget(0, 0, idNum);
  infoGrid.setWidget(0, 1, complaintApp.createTextBox().setName('ID').setId('ID').setStyleAttributes({float: 'left'}));

  infoGrid.setWidget(0, 2, complaintApp.createLabel('Submitted by:').setStyleAttributes({textAlign: 'right', margin: "0 auto"}));
  infoGrid.setWidget(0, 3, complaintApp.createTextBox().setName('subBy').setId('subBy').setStyleAttributes({margin: "0 auto"}));

  infoGrid.setWidget(0, 4, complaintApp.createLabel('Submitted at:').setStyleAttributes({textAlign: 'right'}));
  infoGrid.setWidget(0, 5, complaintApp.createTextBox().setName('subAt').setId('subAt').setStyleAttributes({float: 'left'}));

  infoGrid.setWidget(1, 2, complaintApp.createLabel('Time since complaint \(in hours\):').setStyleAttributes({textAlign: 'right'}));
  infoGrid.setWidget(1, 3, complaintApp.createTextBox().setName('timeSince').setId('timeSince').setWidth(50));

  var guestGrid = complaintApp.createGrid(2, 8).setStyleAttributes({fontWeight: "bold"}).setWidth('100%');
  guestGrid.setWidget(0, 0, complaintApp.createLabel('Guest name:').setStyleAttributes({textAlign: 'right'}));
  guestGrid.setWidget(0, 1, complaintApp.createTextBox().setName('gName').setId('gName'));

  guestGrid.setWidget(0, 2, complaintApp.createLabel('Room #:').setStyleAttributes({textAlign: 'right'}));
  guestGrid.setWidget(0, 3, complaintApp.createTextBox().setName('roomNum').setId('roomNum'));

  guestGrid.setWidget(0, 4, complaintApp.createLabel('Dates of Stay:').setStyleAttributes({textAlign: 'right', float: 'right'}));
  guestGrid.setWidget(0, 5, complaintApp.createTextBox().setName('arrDate').setId('arrDate').setStyleAttributes({float: 'right'}));
  guestGrid.setWidget(0, 6, complaintApp.createLabel(' - ').setStyleAttributes({margin: '0 auto'}));
  guestGrid.setWidget(0, 7, complaintApp.createTextBox().setName('depDate').setId('depDate').setStyleAttributes({float: 'right'}));
  guestGrid.setWidget(1, 0, complaintApp.createLabel('Email Address:').setStyleAttributes({textAlign: 'right'}));
  guestGrid.setWidget(1, 1, complaintApp.createTextBox().setName('email').setId('email'));
  guestGrid.setWidget(1, 2, complaintApp.createLabel('Phone Number:').setStyleAttributes({textAlign: 'right'}));
  guestGrid.setWidget(1, 3, complaintApp.createTextBox().setName('phone').setId('phone'));

  var complaintGrid = complaintApp.createGrid(2, 2).setStyleAttributes({fontWeight: "bold", margin: "0 auto"}).setWidth('100%');
  complaintGrid.setWidget(0, 0, complaintApp.createLabel('Complaint concerns:'));
  complaintGrid.setWidget(1, 0, complaintApp.createTextArea().setName('department').setId('department').setWidth(200));
  complaintGrid.setWidget(0, 1, complaintApp.createLabel('Complaint:'));
  complaintGrid.setWidget(1, 1, complaintApp.createTextArea().setName('complaint').setId('complaint').setWidth(800).setHeight(100).setStyleAttributes({overflow: "auto"}));

  var detailsGrid = complaintApp.createGrid(2, 6).setStyleAttributes({fontWeight: 'bold'}).setWidth('100%');
  detailsGrid.setWidget(0, 0, complaintApp.createLabel('First attempt at resolution by:').setStyleAttributes({textAlign: 'right'}));
  detailsGrid.setWidget(0, 1, complaintApp.createTextBox().setName('firstRes').setId('firstRes'));
  detailsGrid.setWidget(0, 2, complaintApp.createLabel('First attempt at resolution at:').setStyleAttributes({textAlign: 'right'}));
  detailsGrid.setWidget(0, 3, complaintApp.createTextBox().setName('firstTime').setId('firstTime'));
  detailsGrid.setWidget(0, 4, complaintApp.createLabel('Resolution provided:').setStyleAttributes({textAlign: 'right'}));
  detailsGrid.setWidget(0, 5, complaintApp.createTextArea().setName('resList').setId('resList'));
  detailsGrid.setWidget(1, 0, complaintApp.createLabel('Appeasement amount:').setStyleAttributes({textAlign: 'right'}));
  detailsGrid.setWidget(1, 1, complaintApp.createTextBox().setName('appeasement').setId('appeasement'));
  detailsGrid.setWidget(1, 2, complaintApp.createLabel('Guest mindset after initial resolution:').setStyleAttributes({textAlign: 'right'}));
  detailsGrid.setWidget(1, 3, complaintApp.createTextBox().setName('mindset').setId('mindset'));
  detailsGrid.setWidget(1, 4, complaintApp.createLabel('Is follow-up required?').setStyleAttributes({textAlign: 'right'}));
  detailsGrid.setWidget(1, 5, complaintApp.createTextBox().setName('followup').setId('followup'));

  var topPanel = complaintApp.createHorizontalPanel().setStyleAttributes({borderStyle: "groove", borderWidth: "2", borderColor: "threedface"}).setWidth('100%');
  var guestPanel = complaintApp.createCaptionPanel('Guest Information').setStyleAttributes({background: "#D8D8D8", fontWeight: 'bold'});
  var complaintPanel = complaintApp.createCaptionPanel('Complaint Information').setStyleAttributes({background: "#D8D8D8", fontWeight: 'bold', overflow: 'auto'});
  var detailsPanel = complaintApp.createCaptionPanel('Initial Resolution Attempt').setStyleAttributes({fontWeight: 'bold'});


  topPanel.add(infoGrid);
  guestPanel.add(guestGrid);
  complaintPanel.add(complaintGrid);
  detailsPanel.add(detailsGrid);

  prePanel.add(topPanel);
  prePanel.add(guestPanel);
  prePanel.add(complaintPanel);
  prePanel.add(detailsPanel);

  complaintApp.add(prePanel);

  //Take info
  var subPanel = complaintApp.createAbsolutePanel().setWidth('100%').setStyleAttributes({background: '#FBFBEF'})

  var form = complaintApp.createFormPanel();  
  var flow = complaintApp.createFlowPanel();
  var grid1 = complaintApp.createGrid(2, 1).setStyleAttributes({margin: "0 auto"});
  grid1.setWidget(0, 0, complaintApp.createHTML("<br/>"));
  grid1.setWidget(1, 0, complaintApp.createLabel("Please fill out the following, where applicable.")
                   .setStyleAttributes({textDecoration: "underline", fontSize: "16", fontWeight: "bold"}));

  var fuGrid = complaintApp.createGrid(1, 7).setStyleAttributes({margin: "0 auto"})//.setWidth('100%');
  var userName = complaintApp.createTextBox().setName('userName').setId('userName').setStyleAttributes({float: 'left'})
  fuGrid.setWidget(0, 0, complaintApp.createLabel("Your name:").setStyleAttributes({textAlign: 'right', fontWeight: "bold"}));
  fuGrid.setWidget(0, 1, userName);
  fuGrid.setWidget(0, 2, complaintApp.createLabel("Date/time of follow-up:").setStyleAttributes({textAlign: 'right', fontWeight: "bold"}));
  var fuDate = complaintApp.createDateBox().setFormat(UiApp.DateTimeFormat.DATE_SHORT).setName('fuDate').setId('fuDate').setStyleAttributes({float: 'left'})
  fuGrid.setWidget(0, 3, fuDate);
  var fuHour = complaintApp.createListBox().setName('fuHour').setId('fuHour').setWidth(60).setStyleAttributes({float: 'left'}).addItem("Hr");
  var fuMin = complaintApp.createListBox().setName('fuMin').setId('fuMin').setWidth(60).setStyleAttributes({float: 'left'}).addItem("Min");
for (h=0;h<24;++h){
  if(h<10){var hourstr='0'+h}else{var hourstr=h.toString()}
  fuHour.addItem(hourstr)
  }
  for (m=0;m<60;++m){
  if(m<10){var minstr='0'+m}else{var minstr=m.toString()}
  fuMin.addItem(minstr)
  }
  fuGrid.setWidget(0, 4, fuHour.setStyleAttributes({float: 'left'}));
  fuGrid.setWidget(0, 5, fuMin.setStyleAttributes({float: 'left'}));

  var fuDescGrid = complaintApp.createGrid(2, 4).setStyleAttributes({fontWeight: "bold", margin: "0 auto"}).setWidth('100%')
  fuDescGrid.setWidget(0, 1, complaintApp.createLabel('Description of Follow-up:'));
  var fuDesc = complaintApp.createTextArea().setName('fuDesc').setId('fuDesc').setWidth(500).setHeight(70).setStyleAttributes({overflow: "auto"})
  fuDescGrid.setWidget(1, 1, fuDesc);
  fuDescGrid.setWidget(1, 2, complaintApp.createLabel('Amount of appeasement:'));
  var fuApp = complaintApp.createTextArea().setName('fuApp').setId('fuApp');
  fuDescGrid.setWidget(1, 3, fuApp);

  var resSubClose = complaintApp.createGrid(1, 3).setStyleAttributes({margin: "0 auto"})
  var resHandler = complaintApp.createServerHandler("resolved");
  var resolved = complaintApp.createCheckBox("Issue is fully resolved.").setName("resCB").addValueChangeHandler(resHandler).setStyleAttributes({margin: "0 auto"});
  resSubClose.setWidget(0, 0, resolved)
  resSubClose.setWidget(0, 1, complaintApp.createSubmitButton("Submit"));
  var closeHandler = complaintApp.createServerHandler("close");
  var close = complaintApp.createButton("Close").addClickHandler(closeHandler);
  resSubClose.setWidget(0, 2, close)

  var resTf = complaintApp.createLabel("test").setId("resTf").setVisible(false)

  subPanel.add(grid1);
  flow.add(fuGrid);
  flow.add(fuDescGrid);
  flow.add(resSubClose);  
  form.add(flow);

  subPanel.add(form);

  complaintApp.add(subPanel);
  complaintApp.add(resTf);
  //var spreadSheet = SpreadsheetApp.getActiveSpreadsheet();
  //spreadSheet.show(complaintApp);

  return complaintApp;
}
function resolved(e){
  var app = UiApp.getActiveApplication();
  if (e.parameter.resCB == true){
    app.getElementById('resTf').setText("Yes")
    return app;
  }

}

function close(e) {
  var app = UiApp.getActiveApplication();
  app.close();
  return app;
}