Date AND Time picker Google App Script

Question

Is it possible to add a picker box for both Date AND Time within a GUI?

If not, is it possible to combine two variables, one for date (picker) and the other for time (number) into one variable to be used as a Start Time variable for calendar?

Thanks!

Answer 1

here is a working solution using listBoxes, test it in a spreadsheet(make a copy to use)

function listBoxVersion() {
  var app = UiApp.createApplication().setTitle('Time Picker');
  var main = app.createGrid(2, 4);
  var date = app.createDateBox().setName('date');
  var hour = app.createListBox().setName('hour').setWidth('100');
  var min = app.createListBox().setName('min').setWidth('100');
  for (h=0;h<24;++h){
  if(h<10){var hourstr='0'+h}else{var hourstr=h.toString()}
  hour.addItem(hourstr)
  }
  for (m=0;m<60;++m){
  if(m<10){var minstr='0'+m}else{var minstr=m.toString()}
  min.addItem(minstr)
  }
  var button = app.createButton('validate')
  main.setWidget(0,0,app.createLabel('Choose Date')).setWidget(0,1,app.createLabel('Choose Hours')).setWidget(0,2,app.createLabel('Choose minutes'))
  main.setWidget(1,0,date).setWidget(1,1,hour).setWidget(1,2,min)
  main.setWidget(1,3,button)
  var handler = app.createServerHandler('show').addCallbackElement(main)
  button.addClickHandler(handler)
  app.add(main)
  ss=SpreadsheetApp.getActive()
  ss.show(app)
}

function show(e){
  ss=SpreadsheetApp.getActive()
  ss.getRange('A1').setValue(Utilities.formatDate(e.parameter.date,'GMT+02:00','MMM-dd-yyyy')+'  @ '+e.parameter.hour+':'+e.parameter.min)
  var date = new Date(e.parameter.date);
  date.setHours(e.parameter.hour,e.parameter.min,0)
  ss.getRange('A2').setValue(date)
  }

EDIT : and here is another version with an ordinary textBox :(available in the same test sheet)

  function textVersion() {
  var app = UiApp.createApplication().setTitle('Time Picker');
  var main = app.createGrid(2, 4);
  var date = app.createDateBox().setName('date');
  var hour = app.createTextBox().setName('time').setWidth('150');
  var button = app.createButton('validate')
  main.setWidget(0,0,app.createLabel('Choose Date')).setWidget(0,1,app.createLabel('Enter Hours:minutes'))
  main.setWidget(1,0,date).setWidget(1,1,hour);
  main.setWidget(1,3,button)
  var handler = app.createServerHandler('show2').addCallbackElement(main)
  button.addClickHandler(handler)
  app.add(main)
  ss=SpreadsheetApp.getActive()
  ss.show(app)
}

function show2(e){
  ss=SpreadsheetApp.getActive()
  var time = e.parameter.time.split(':')
  var hour = time[0]
  var min = time[1]
  ss.getRange('A1').setValue(Utilities.formatDate(e.parameter.date,'GMT+02:00','MMM-dd-yyyy')+'  @ '+hour+':'+min)
  var date = new Date(e.parameter.date);
  date.setHours(hour,min,0)
  ss.getRange('A2').setValue(date)
  }