有馬総一郎のブログ

(彼氏の事情)

2024年03月07日 08:24:52 JST - 4 minute read - Comments - Google

Google Formの初期値に第何曜日の日付を設定する

WordPressの Contact Form 7から入力されると、自動返信が届かない、通知先のGoogleのグループにも保留扱いで届かなくなってしまった。 2024年2月にGmailで起こる変更について｜注意点や対応すべき点について - カゴヤのサーバー研究室などで説明されてるようにメール受信の基準が厳しくなったのか。

急遽、フォーム画面をGoogle Formに差し替えたのだけど、やはり入力の手間を省いてあげたいということで、初期値・デフォルト値を設定したい。

Google Fromの初期値はGETパラメータで設定

フォーム編集画面から縦3点から、 事前入力したURLを取得 をクリックしてURL末尾が/prefillの事前入力画面を開き、 リンクを取得 ボタンを押すが取得できない！？後で知ったが、Firefox1だと取得できない…

なので、 #68 フォームの初期値を設定した URL を生成する｜ともかつのノートで細かく説明されたページがあったので、それを頼りにフォームのソースから該当項目を特定して、URLを作成した。

具体的にはviewform?usp=pp_url&entry.数字=値をURLエンコードした値となっている。

しかし、今回、コンボボックスや固定値ではなく、変動する日付を初期値としたかった。最初は、フォームにリンクする画面で、WordPressのショートコードを使って渡そかと思ったのだけど、場所がウィジェットだったり、投稿ページだったり、固定ページだったりとバラバラだったので、 Simple Custom CSS and JSプラグインをインストールして、特定のURLのリンクを見つけたら、パラメータを足すようにした。

WordPressに設置したGoogle Formのリンクに日付パラメータの値を渡す

また、JavaScriptというと、ネイティブのままだと日付を扱う関数が揃ってないので、第何曜日を取得するコードをゴリゴリ書く必要があったが、そこは ChaptGPTの力を借りて、雛形を作りそこから改修した。

function getNextTuesday() {
  // 現在の日付を取得
  const now = new Date();
  now.setHours(0, 0, 0, 0);
  // 今月の第2火曜日を取得
  const secondTue = new Date(now.getFullYear(), now.getMonth(), 1);
  while (secondTue.getDay() !== 2) {
    secondTue.setDate(secondTue.getDate() + 1);
  }
  secondTue.setDate(secondTue.getDate() + 7); // 一週間進める

  // 今月の第4火曜日を取得
  const fourthTue = new Date(now.getFullYear(), now.getMonth(), secondTue.getDate() + 14);

  // 現在の日付が第4火曜日以降の場合は、次の月の第2火曜日を取得
  let nextSecondTue;
  if (now > fourthTue) {
    const nextMonthTue = new Date(now.getFullYear(), now.getMonth() + 1, 1);
    while (nextMonthTue.getDay() !== 2) {
      nextMonthTue.setDate(nextMonthTue.getDate() + 1);
    }
    nextMonthTue.setDate(nextMonthTue.getDate() + 7); // 一週間進める
    nextSecondTue = nextMonthTue;
  } 
  // 現在の日付が第2火曜日以降の場合は、今月の第4火曜日を取得
  else if (now > secondTue) {
    nextSecondTue = fourthTue;
  }
  // 現在の日付が第2火曜日より前の場合は、今月の第2火曜日を取得
  else {
    nextSecondTue = secondTue;
  }
  return nextSecondTue;
}

function formatDate(date) {
  var year = date.getFullYear();
  var month = ('0' + (date.getMonth() + 1)).slice(-2);
  var day = ('0' + date.getDate()).slice(-2);
  return year + '-' + month + '-' + day;
}

window.onload = function() {
  // ページが読み込まれたときに実行されるコード
  const links = document.querySelectorAll('a[href^="https://docs.google.com/forms"]'); // Google FormのURLから始まる<a>要素を取得
    links.forEach(function(link) {
    var href = link.getAttribute('href'); // href 属性の値を取得
    href += '&entry.588393791=' + formatDate(getNextTuesday()); // href に '&entry.588393791=' を追加
    link.setAttribute('href', href); // href 属性を更新
  })
};

Google Formの日付はYYYY-MM-DDの文字列として渡す必要があるが、toISOString()2というメソッドを使うと日付がUTC、協定世界時になった上でYYYY-MM-DDになってしまうので、お手製で文字列変換する。

ちなみにGoogle Formのトリガーで起動時というのがあるが、それはフォームを開いたときではなく、 Google フォームの GAS 実行トリガーの設定「起動時」とは。によれば、編集作業開始時らしいので初期値設定はできない。

これでGoogle Formの日付項目に任意の値を初期値設定することが出来た。今度は、フォームで回答した日付をGoogle Calendarに追加できるボタンをメール本文に埋め込み、返信したいと思う。

  1. バージョン 123.0.1 (64 ビット)。おまかんかも知れない。Google Chromeだと リンクを取得 ボタンを押下するとクリップボードにコピーされる。 ↩︎

  2. Date.prototype.toISOString() ↩︎