LANG SELRCT

コードを書く場所についてはこちら

2018年1月20日土曜日

現在日時を取得して入力欄に入れる

HTML Serviceでこういう入力欄を作る


アプリケーションを起動した時に
現在の日付けと時刻を入れてあげる





コード.gs
function doGet() {
  return HtmlService.createHtmlOutputFromFile("index");
}

function get_date_gs() {
  var date = new Date();
  var localtime = Utilities.formatDate(date, 'Asia/Tokyo', 'yyyy-MM-dd/HH:mm:ss');
  var date = localtime.split("/")[0];
  var time = localtime.split("/")[1];
  var datetime = [date, time]
  return datetime;
}
意訳
この機能がやること
指定したHTMLファイルを表示する


この機能がやること
現在日時を取得して
日本時間にして
日付けを取り出して
時間を取り出して
配列に入れて
返す




index.html
<!DOCTYPE html>
<html>
<body>
  <input type="date" id="date">
  <input type="time" id="time">
  <script>
    document.addEventListener('DOMContentLoaded', get_date);

    function get_date() {
      google.script.run
        .withSuccessHandler(onSuccess)
        .get_date_gs();
    }

    function onSuccess(datetime) {
      document.getElementById("date").value = datetime[0];
      document.getElementById("time").value = datetime[1];
    }
  </script>
</body>
</html>
意訳
これはHTML5文書です


日付けの入力欄を置く
時間の入力欄を置く

HTMLドキュメントの読み込みが完了したらget_dateを実行する

この機能がやること
.gsファイルのスクリプトを実行して
成功したらonSuccessを実行する
実行する.gsのスクリプトはget_date_gs()


この機能がやること
日付けを取り出して日付けの入力欄に入れて
時間を取り出して時間の入力欄に入れる






補足


日付けの入力欄は 2018/01/20 と表示されるので
同じように / で区切って 2018/01/20 を渡しましたが受け取ってもらえず
- で区切って 2018-01-20 とすると渡せました

なのでコード.gsでも 'yyyy-MM-dd/HH:mm:ss' としています


参考

HTML Input Types
https://www.w3schools.com/html/html_form_input_types.asp