清除一个DateBox或将一个DatePicker附加到一个TextBox上 - Google Script

Question

是否可以在处理函数中清除DateBox的值？ 你可以用一个简单的处理函数来清除一个TextBox的值。app.getElementById('id').setValue(''); 而且你可以通过在ListBox中加入以下内容将其值设置为空白值 listBox.addItem('') 然后将ListBox设置为该项目，并使用 app.getElementById('id').setItemSelected({item # for blank item}, true); 但我一直无法找到清除DateBox的方法。 我们的目标是有一个简单的表单，允许用户填写并通过按钮提交表单，然后让表单自动复位，这样用户就可以再次填写并提交新的表单。

另外，如果像我猜测的那样，还不能清除DateBox（功能限制），那么我可以简单地使用TextBox。 为了让事情看起来更好（并帮助用户以脚本所期望的格式输入日期），如果我能在TextBox中添加一个DatePicker就更好了，但是除了我找到的那个从头开始生成整个DatePicker函数的旧教程之外，我还没有找到一个简单的方法来将新的DatePicker GAS类附加到TextBox上。

GAS文档。https:/developers.google.comapps-scriptreferenceuidate-box。

日期挑选器2教程 - https:/sites.google.comsiteappsscripttutorialmiscellaneousdatepicker-2。

简化了很多的示例代码，希望能提供足够的信息，而不至于强迫大家读5页代码来达到我想强调的目的。 请注意注释，尤其是在 submitHandler(e) 函数。 这段代码可以复制到一个空白的（保存的）电子表格中进行测试，或者你可以替换电子表格的特定代码，只返回应用程序，如果你更喜欢这样做。

//Opens the active spreadsheet and selects the first sheet.
var ss = SpreadsheetApp.getActiveSpreadsheet();
var sheets = ss.getSheets();
var sheet = sheets[0];

function doGet() {
var app = UiApp.createApplication().setTitle('Test Form');
//Main panel with a 3x2 grid hosting labels and boxes.
var mainVP = app.createVerticalPanel();
  var mainCP = app.createCaptionPanel('Purchase Details');
    var mainG = app.createGrid(3, 2);
      var nameL = app.createLabel('Name');
      var nameT = app.createTextBox().setName('name').setId('name');
      var dateL = app.createLabel('Date');
      var dateD = app.createDateBox().setName('date').setId('date');
      var ownL = app.createLabel('Own/Lease');
      var ownC = app.createListBox().setName('ownLease').setId('ownLease');
//Submit button with auto-reset functionality.
    var subHP = app.createHorizontalPanel().setSize('100%', '40px');
      var subL = app.createLabel('Submitted').setId('subL').setVisible(false);
      var subB = app.createButton('Submit');
//Handler for button.
var subHandler = app.createServerHandler('submitHandler');
subHandler.addCallbackElement(mainVP);
subB.addClickHandler(subHandler);
//Add options to ListBox.
ownC.addItem('').addItem('Own').addItem('Lease');
//Place widgets on Grid.
mainG.setWidget(0, 0, nameL).setWidget(0, 1, nameT)
  .setWidget(1, 0, dateL).setWidget(1, 1, dateD)
  .setWidget(2, 0, ownL).setWidget(2, 1, ownC);
//Aligns the submit Button and Label to the right and adds them to their HPanel.
subHP
  .add(subL).setCellHorizontalAlignment(subL, UiApp.HorizontalAlignment.RIGHT)
  .add(subB).setCellHorizontalAlignment(subB, UiApp.HorizontalAlignment.RIGHT);
//Adds stuff to panels so it shows up.
mainCP.add(mainG);
mainVP.add(mainCP);
mainVP.add(subHP);
app.add(mainVP);
var doc = SpreadsheetApp.getActive();
doc.show(app);
}

function submitHandler(e) {
var app = UiApp.getActiveApplication();
//Set variables for each field in the Purchase Details CaptionPanel.
var name = e.parameter.name;
var date = e.parameter.date;
var ownLease = e.parameter.ownLease;
  //I use a sheet.appendRow() method here but for the purposes of this question-
  //we don't actually need the data, just need to clear it.
//Clears data from form to prepare for another submission.
app.getElementById('name').setValue('');
//app.getElementById('date') /* This is the field I need to clear somehow. */
app.getElementById('ownLease').setItemSelected(0, true);
//Displays the word "Submitted" when the Submit Button is clicked.
var label = app.getElementById('subL');
label.setVisible(true).setStyleAttribute('color', 'blue');
return app;
}

总而言之。

1. 是否有办法使用处理函数清除DateBox中的值，如果有，如何清除？
2. 如果清除DateBox是不可能的，那么我如何将DatePicker添加到TextBox中，并将数据输入限制为特定的格式（所以TextBox不会将 "blahblahblah "作为有效日期）？

Answer 1

你有没有尝试过第三种解决方案，即创建一个新的数据选择器部件，并将其添加到你的网格中以替换 "填充的"？

这里是一个测试，我在提交处理程序中做了 "替换"，但我想它应该放在一个单独的处理程序中，比如说 "再次提交"......（但这取决于你）。

我修改了你的提交确认，以显示新的datePicker返回的日期(只是为了测试)

//Opens the active spreadsheet and selects the first sheet.
var ss = SpreadsheetApp.getActiveSpreadsheet();
var sheets = ss.getSheets();
var sheet = sheets[0];
var popAttributes = {'padding':'10px','font-family':"Arial, sans-serif",'fontSize':'10pt','color':'#000099','background':'#ffffee','border-radius':'10px'}
var btnAttributes = {'padding':'3px','font-family':"Arial, sans-serif",'fontSize':'10pt','border-radius':'6px'}

function doGet() {
var app = UiApp.createApplication().setTitle('Test Form');
//Main panel with a 3x2 grid hosting labels and boxes.
var mainVP = app.createVerticalPanel();
  var mainCP = app.createCaptionPanel('Purchase Details').setStyleAttributes(popAttributes);
    var mainG = app.createGrid(3, 2).setId('grid');
      var nameL = app.createLabel('Name');
      var nameT = app.createTextBox().setName('name').setId('name');
      var dateL = app.createLabel('Date');
      var dateD = app.createDateBox().setName('date').setId('date');
      var ownL = app.createLabel('Own/Lease');
      var ownC = app.createListBox().setName('ownLease').setId('ownLease');
//Submit button with auto-reset functionality.
    var subHP = app.createHorizontalPanel().setSize('100%', '40px');
      var subL = app.createLabel('Submitted').setId('subL').setVisible(false);
      var subB = app.createButton('Submit').setStyleAttributes(btnAttributes);
//Handler for button.
var subHandler = app.createServerHandler('submitHandler');
subHandler.addCallbackElement(mainVP);
subB.addClickHandler(subHandler);
//Add options to ListBox.
ownC.addItem('').addItem('Own').addItem('Lease');
//Place widgets on Grid.
mainG.setWidget(0, 0, nameL).setWidget(0, 1, nameT)
  .setWidget(1, 0, dateL).setWidget(1, 1, dateD)
  .setWidget(2, 0, ownL).setWidget(2, 1, ownC);
//Aligns the submit Button and Label to the right and adds them to their HPanel.
subHP
  .add(subL).setCellHorizontalAlignment(subL, UiApp.HorizontalAlignment.RIGHT)
  .add(subB).setCellHorizontalAlignment(subB, UiApp.HorizontalAlignment.RIGHT);
//Adds stuff to panels so it shows up.
mainCP.add(mainG);
mainVP.add(mainCP);
mainVP.add(subHP);
app.add(mainVP);
var doc = SpreadsheetApp.getActive();
doc.show(app);
}

function submitHandler(e) {
var app = UiApp.getActiveApplication();
//Set variables for each field in the Purchase Details CaptionPanel.
var name = e.parameter.name;
var date = e.parameter.date;
var ownLease = e.parameter.ownLease;
  //I use a sheet.appendRow() method here but for the purposes of this question-
  //we don't actually need the data, just need to clear it.
//Clears data from form to prepare for another submission.
app.getElementById('grid').setWidget(1, 1, app.createDateBox().setId('date').setName('date'))
app.getElementById('date') /* This is the field I need to clear somehow. */
app.getElementById('ownLease').setItemSelected(0, true);
//Displays the word "Submitted" when the Submit Button is clicked.
var label = app.getElementById('subL');
label.setVisible(true).setStyleAttribute('color', 'blue').setText(e.parameter.date);// to test the returned date value
return app;
}