質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

90.40%

  • JavaScript

    21451questions

    JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

  • HTML

    12182questions

    HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

  • Google Apps Script

    1400questions

    Google Apps ScriptはGoogleの製品と第三者のサービスでタスクを自動化するためのJavaScriptのクラウドのスクリプト言語です。

[GAS][JavaScript]日付の取扱い、htmlで入力した日付とスプレッドシートから取得した日付の比較を行いたい

解決済

回答 2

投稿

  • 評価
  • クリップ 1
  • VIEW 590

前提・実現したいこと

HTMLで作成したフォームで日付を入力する。
入力した日付と一致するセルがスプレッドシートにあるか調べる。
→ ここで詰まった。
日付が一致した行の任意列の値を配列に詰め、htmlに返す。
配列の値をhtmlのSelectBoxに設定。

発生している問題・エラーメッセージ

日付の書式が違う?為うまく比較することができない。

試したこと

1.html上でhtmlで入力した日付をテキストボックスに表示
→ 2018-12-29と表示
2.スプレッドシートから読み取った値をStringに変換して比較
→ 効果なし
3.スプレッドシートから読み取った値をDate型に変換して比較
→ 効果なし
4.スプレッドシートから読み取った値をDate型に変換後、フォーマットをyyyy-mm-ddに変換して比較
→ 効果なし
5.html上で入力した日付をDate型に変換しGAS

該当のソースコード

<!doctype html>
<html>
    <head>
        <base target="_top">
    </head>

    <script type="text/javascript">
    ///////////////////////////////////////////////////////////////////////////////
    /////  定数の宣言                                                           /////
    ///////////////////////////////////////////////////////////////////////////////
    // 1日に立卓する最大卓数
    // シナリオ名受信に使用、不足なら増やすこと。
    MAX_SESSION_NUM = 50;

    // メッセージコード
    // メッセージと対応を取ること。
    var MESSAGE_CODE =
    {
        TEXT_RESET             : 0,
        SESSION_NUM_OVER       : 1,
        SESSION_NOT_REG        : 2,
        GUIDE_SELECT_SNR       : 3,
    };

    // メッセージ
    // メッセージコードと対応をとること。
    var MESSAGE_LIST = 
    [
       "サーバ処理終了待ちです",
       "指定日の卓が多すぎます。管理者に問い合わせて下さい。",
       "指定日に登録されている卓はありません。",
       "シナリオを選択してください。",
    ];

    ///////////////////////////////////////////////////////////////////////////////
    /////  GAS呼出後実行する関数                                                 /////
    ///////////////////////////////////////////////////////////////////////////////
    // 日付探索
    function CallGas_SearchSenarioByDate(ret)
    {
      // 一致する行の最大数超過時
      if(ret == false)
      {
        OutputMessage(MESSAGE_CODE.SESSION_NUM_OVER);
      }
    }
    ///////////////////////////////////////////////////////////////////////////////
    /////  JavaScript内サブルーチン                                             /////
    ///////////////////////////////////////////////////////////////////////////////
    // Selectの要素全削除
    function RemoveSelectBoxOption(control)
    {
        if (control.hasChildNodes())
        {
            while (control.childNodes.length > 0)
            {
                control.removeChild(control.firstChild)
            }
        }
    }

    // Selectの要素追加(配列)
    function AddSelectBoxOption(control,arrData)
    {
        //配列をセレクトボックスにセットする
        for(var i=0;i<arrData.length;i++)
        {
            let op = document.createElement("option");
            op.value = "";      //value値
            op.text = arrData[i];   //text値
            control.appendChild(op);
        }
    };

    // メッセージ出力
    function OutputMessage(MessageCode)
    {
        document.getElementById("txtDebug").value
         = MESSAGE_LIST[MessageCode];
    }

    ///////////////////////////////////////////////////////////////////////////////
    /////  HTMLでの処理                                                        /////
    ///////////////////////////////////////////////////////////////////////////////
    // 日付が選択された時
    function DateSet()
    {
      // セレクトボックスの初期化
      RemoveSelectBoxOption(document.getElementById("selSenarioName"));
      gs_SearchDateErr = 0;

      // 日付行の取得
      var arrData = Array(MAX_SESSION_NUM);
      arrData.fill("");

      var dateTemp = document.getElementById("txtSelectDate").value;

      google.script.run
             .withSuccessHandler(CallGas_SearchSenarioByDate)
             .SearchSenarioByDate(dateTemp, arrData);

      // データの確認
      if(String(arrData[0]) == "")
      {
         OutputMessage(MESSAGE_CODE.SESSION_NOT_REG);
      }
      else if(gs_SearchDateErr != 1)
      {
        // 日付行のシナリオ名情報をSelectBoxに追加
        AddSelectBoxOption(document.getElementById("selSenarioName"),arrData);
        OutputMessage(MESSAGE_CODE.GUIDE_SELECT_SNR);
      }
    }

    </script>

    <body>
        <form>
            <p>
            セッション選択<br>
                 開催日  <input type="date" value="" id="txtSelectDate" onchange="DateSet()"><br>
                 シナリオ名<select id="selSenarioName" onchange="SenarioSet()" disabled>
                             <option value=""></option>
                             </select>

            </p>
            <!--- 中略 --->
            <p>              
                実行結果 
                 <input type="text" value="" id="txtDebug"><br>
            </p>
            <p>
            <a href = "https://script.google.com/macros/s/URL_ID/exec?p=index">メイン画面へ戻る</a><br>
            </p>
        </form>
    </body>
</html>
function SearchSenarioByDate(date,cellVal)
{
  // データベースファイル
  var sheet
   = SpreadsheetApp
      .openById(DATABASE_FILE_NAME)
      .getSheetByName(DATABASE_SS_MAIN);

  // Hit件数
  var nSerchHit = 0;

  //受け取ったシートのデータを二次元配列に取得
  var dat = sheet.getDataRange().getValues();

  // 値の探索、値が見つかった場合行数を返却
  for(var i = 0; i < dat.length;i++)
  {
    if(i > cellVal.length)
    {
      return false;
    }
    var dateTemp = new dat[i][DATABASE_START_DATE_COL - 1];

    if(dateTemp == date)
    {
      // シナリオ名を配列に格納
      cellVal[nSerchHit] = dat[i][DATABASE_SENARIO_NAME_COL - 1];
      nSerchHit++;
    }
    else
    {
      if(nSerchHit != 0)
      {
        break;
      }
    }
  }

  return true;
}
  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

質問への追記・修正、ベストアンサー選択の依頼

  • papinianus

    2018/12/30 14:18

    詰まっているのはfalseが返されることですか?if(i > cellVal.length)のifブロックは意味的に妥当なチェックでしょうか?こいつがfalseを返している?

    キャンセル

  • papinianus

    2018/12/30 15:17 編集

    違うかな。適切なリターンをしていない、受け取ってないから何も起こらないということでは?以前にも書いたように非同期を投げた直後のスクリプトはawaitしてないので(gasではできない)、サーバ応答を待たずに処理してarrData[0]が必ず空の判定が成り立ちます。また、サーバとクライアントで配列は参照渡しできないので、成功時ハンドラで返り値を受けましょう

    キャンセル

  • Arisa.Sunagawa

    2018/12/31 00:51

    成功時ハンドラが起きてから次へ進む(処理終わるまで待ってくれる)と勘違いしてました。

    配列を戻り値とすること、成功時ハンドラ内にarrData[0]の比較等を入れることの2点修正してみます。

    キャンセル

回答 2

check解決した方法

0

papinianusさんの指摘事項を修正することで動作しました。

ありがとうございました。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

0

比較については変数dateに何が入っているかによりますが、下記部分はひとまず new Date() を使うことになります。

// var dateTemp = new dat[i][DATABASE_START_DATE_COL - 1];
//                     ↓                                        ↓
   var dateTemp = new Date( dat[i][DATABASE_START_DATE_COL - 1] );

【Spreadsheetでの日付と、Google Apps ScriptでのnewDate()】
https://jjnurburg.com/newdate/

【Google Apps ScriptでのDateオブジェクトの各生成方法、日付と時刻を分ける】
https://tonari-it.com/gas-date-object/

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2018/12/30 09:30

    dateはhtmlのテキストボックス

    <input type="date" value="" id="txtSelectDate" onchange="DateSet()">

    への入力値です。以下のように取得しています。

    date=document.getElementById("txtSelectDate").value;

    また、以下の関数でGASへデータを渡しています。
    google.script.run
    .withSuccessHandler(CallGas_SearchSenarioByDate)
    .SearchSenarioByDate(date, arrData);

    キャンセル

  • 2018/12/31 00:18

    それならdateは文字列なので、new Date( date ) とする必要がありますね。その上でUtilities.formatDateで同じ表記に整えてから比較すればよいでしょう。(1つ目の記事参照)

    キャンセル

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 90.40%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

同じタグがついた質問を見る

  • JavaScript

    21451questions

    JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

  • HTML

    12182questions

    HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

  • Google Apps Script

    1400questions

    Google Apps ScriptはGoogleの製品と第三者のサービスでタスクを自動化するためのJavaScriptのクラウドのスクリプト言語です。