新規投稿
フォローする

一覧画面での検索を複数及びユーザー、日付にする場合

お世話になっております。javascriptを始めたばかりの初心者です。

こちらのページを参考に、下記の窓は表示されています。

 

①FIELD_CODE2の作業者は、ステータスの作業者(ユーザー)を選択したい。

 likeを、途中いくつか" in "に変えてみましたが、うまくいきませんでした。

②FIELD_CODE3、FIELD_CODE4は、日付フィールドを選択したい。

 例:2021-06-01 ~ 2021-06-30 

 if文を追加する場合、どのようなコードにするば良いか教えて下さい。

 7パターン(?)は複雑すぎるでしょうか?

始めたばかりで勉強不足だとは思うのですが、ご教示いただけると幸いです。

以下 作成中コード↓

// 設定値
const FIELD_CODE1 = "案件名";
const FIELD_CODE1_NAME = "案件名 ";
const AND_OR = "and";  // 必ず小文字
const FIELD_CODE2 = "作業者";
const FIELD_CODE2_NAME = "作業者 ";
const FIELD_CODE3 = "完了日";
const FIELD_CODE3_NAME = "完了日 ";
const FIELD_CODE4 = "完了日";
const FIELD_CODE4_NAME = " ~ ";

// 一覧表示のタイミングで実行
(function () {
  "use strict";
  kintone.events.on("app.record.index.show", function (event) {
    // GET引数に格納された直前の検索キーワードを取得して再表示する
    var result = {};   
    var query = window.location.search.substring( 7 );  // URL固定部分(?query=)は無視

    // クエリ検索条件の区切り記号 (and/or) で分割
    var parameters = query.split( AND_OR );

    // フィールドコード名と検索キーワードに分割する
    for( var i = 0; i < parameters.length; i++ ){
        var element = parameters[ i ].split( 'like' );
        var paramName = decodeURIComponent( element[0] );
        var paramValue = decodeURIComponent( element[1] );
       
        // スペースと""をtrimして、文字列だけにしてから、配列に格納
        result[ paramName.replace(/^\s+|\s+$/g, "") ] = paramValue.replace(/^[\s|\"]+|[\s|\"]+$/g, "");
    }   

    // 検索キーワードその1
    var search_word1 = document.createElement('input');
    search_word1.onkeypress = function(e) {
        if (e.keyCode && e.keyCode == 13) {
           keyword_search();
        }
    }
    if(result[ FIELD_CODE1 ] != undefined){
        search_word1.value  = result[ FIELD_CODE1 ];   // GET引数に、直前の検索キーワードがあったら格納しておく
    }
   
    // 検索キーワードその2
    var search_word2 = document.createElement('input');
    search_word2.onkeypress = function(e) {
        if (e.keyCode && e.keyCode == 13) {
           keyword_search();
        }
    }
    if(result[ FIELD_CODE2 ] != undefined){
        search_word2.value  = result[ FIELD_CODE2 ];   // GET引数に、直前の検索キーワードがあったら格納しておく
    }
   
    // 検索キーワードその3
    var search_word3 = document.createElement('input');
    search_word3.onkeypress = function(e) {
        if (e.keyCode && e.keyCode == 13) {
            keyword_search();
        }
    }
    if(result[ FIELD_CODE3 ] != undefined){
        search_word3.value  = result[ FIELD_CODE3 ];   // GET引数に、直前の検索キーワードがあったら格納しておく
    }

    // 検索キーワードその4
    var search_word4 = document.createElement('input');
    search_word4.onkeypress = function(e) {
        if (e.keyCode && e.keyCode == 13) {
            keyword_search();
        }
    }
    if(result[ FIELD_CODE4 ] != undefined){
    search_word4.value  = result[ FIELD_CODE4 ];   // GET引数に、直前の検索キーワードがあったら格納しておく
}
    // 検索ボタン
    var search_button = document.createElement('button');
    search_button.innerHTML = '検索';
    search_button.onclick = function () {
        keyword_search();
    };
   
    // キーワード検索の関数
    function keyword_search(){
      var keyword1 = search_word1.value;
      var keyword2 = search_word2.value;
      var keyword3 = search_word3.value;
      var keyword4 = search_word4.value;
      var str_query = '?query='+ FIELD_CODE1 +' like "' + keyword1 + '" '
     + AND_OR +' '+ FIELD_CODE2 +' in "' + keyword2 + '"'
     + AND_OR +' '+ FIELD_CODE3 +' >= "' + keyword3 + '"'
     + AND_OR +' '+ FIELD_CODE4 +' <= "' + keyword4 + '"';
     
      if(keyword1 == "" && keyword2 == ""){
        str_query = "";
      }else if(keyword1 != "" && keyword2 == ""){
        str_query = '?query='+ FIELD_CODE1 +' like "' + keyword1 + '"'
      }else if(keyword1 == "" && keyword2 != ""){
        str_query = '?query='+ FIELD_CODE2 +' in "' + keyword2 + '"'
      }
     
      // GET変数を使って、検索結果へジャンプ!
      document.location = location.origin + location.pathname + str_query
    }

    // キーワード入力部品を、kintoneヘッダ部分に埋め込む(重複を避けるため、最初に要素をクリアしておく)
    var aNode = kintone.app.getHeaderMenuSpaceElement()
  
            for (var i =aNode.childNodes.length-1; i>=0; i--) {
            aNode.removeChild(aNode.childNodes[i]);
        }
       
    var label = document.createElement('label');
    label.appendChild(document.createTextNode(FIELD_CODE1_NAME));
    label.appendChild(search_word1);
    label.appendChild(document.createTextNode('  '+ AND_OR +' '));
    label.appendChild(document.createTextNode(FIELD_CODE2_NAME));
    label.appendChild(search_word2);
    label.appendChild(document.createTextNode('  '+ AND_OR +' '));
    label.appendChild(document.createTextNode(FIELD_CODE3_NAME));
    label.appendChild(search_word3);
    label.appendChild(document.createTextNode(FIELD_CODE4_NAME));
    label.appendChild(search_word4);   
    label.appendChild(document.createTextNode('   '));   
    label.appendChild(search_button);
    kintone.app.getHeaderMenuSpaceElement().appendChild(label);

    return event;
  });

})();

 

 

0

2件のコメント

Avatar
juridon

こんにちは!

詳しく読めてないですが、パッと見で気づいたところですが、

in を使う時は in ( "A", "B") みたいな感じで使います。()が必要です。

下記をご確認されて見直してみられると良いかもしれません。
kintone API のクエリの書き方の基本
「query」パラメータで利用可能な演算子と関数

 

 

 

1
Avatar
渡邉祐子

juridon様

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

まだまだ時間がかかりそうですが、学習しながら解決していきたいと思います。

0
サインインしてコメントを残してください。