LoginSignup
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

@kitamon

kintone新規登録用レコードのデータ構築関数の作成

Posted at

はじめに

kintoneアプリのレコード内容をサクッと取得できる方法を記事にしたのですが、今回は、取得したレコード内容を元にレコード構造を作成する関数を作ってみたいと思います。
レコード更新は更新元レコードの内容を修正すればよいので、今回作成する関数はレコード新規登録用となります。

サンプルアプリ

前回記事の流用です。
レコード構造を確認しやすいように、レコード内容を登録しておきます。

image.png

レコードを取得

ベースとなるレコードを取得します。レコード取得の手順は前回の記事をご覧ください。

こんな感じで取得できます。

sample_1.json
{
    "record": {
        "支店コード": {
            "type": "SINGLE_LINE_TEXT",
            "value": "SMPL001"
        },
        "支店名": {
            "type": "SINGLE_LINE_TEXT",
            "value": "サンプル支店"
        },
        "配送オプション": {
            "type": "CHECK_BOX",
            "value": [
                "段ボール",
                "冷蔵"
            ]
        },
        "明細テーブル": {
            "type": "SUBTABLE",
            "value": [
                {
                    "id": "209188",
                    "value": {
                        "品目コード": {
                            "type": "SINGLE_LINE_TEXT",
                            "value": "001"
                        },
                        "品名": {
                            "type": "SINGLE_LINE_TEXT",
                            "value": "みかん"
                        },
                        "数量": {
                            "type": "NUMBER",
                            "value": "1"
                        }
                    }
                }
            ]
        },
        "$revision": {
            "type": "__REVISION__",
            "value": "5"
        },
        "$id": {
            "type": "__ID__",
            "value": "1"
        },
        "レコード番号": {
            "type": "RECORD_NUMBER",
            "value": "1"
        },
        "更新者": {
            "type": "MODIFIER",
            "value": {
                "code": "K211033",
                "name": "ds_user"
            }
        },
        "作成者": {
            "type": "CREATOR",
            "value": {
                "code": "K211033",
                "name": "ds_user"
            }
        },
        "更新日時": {
            "type": "UPDATED_TIME",
            "value": "2022-11-30T11:40:00Z"
        },
        "作成日時": {
            "type": "CREATED_TIME",
            "value": "2022-11-29T10:35:00Z"
        }
    }
}

取得したレコード内容から不要部の削除

レコード新規登録時には、$id項目、$revision、レコード番号や作成者、作成日時、更新者、更新日時、サブテーブルのid項目等が不要になるので削除します。

sample_2.json
{
    "record": {
        "支店コード": {
            "type": "SINGLE_LINE_TEXT",
            "value": "SMPL001"
        },
        "支店名": {
            "type": "SINGLE_LINE_TEXT",
            "value": "サンプル支店"
        },
        "配送オプション": {
            "type": "CHECK_BOX",
            "value": [
                "段ボール",
                "冷蔵"
            ]
        },
        "明細テーブル": {
            "type": "SUBTABLE",
            "value": [
                {
                    "value": {
                        "品目コード": {
                            "type": "SINGLE_LINE_TEXT",
                            "value": "001"
                        },
                        "品名": {
                            "type": "SINGLE_LINE_TEXT",
                            "value": "みかん"
                        },
                        "数量": {
                            "type": "NUMBER",
                            "value": "1"
                        }
                    }
                }
            ]
        }
    }
}

サブテーブル項目の関数化

深い階層から、関数化していきます。サブテーブルの無いkintoneアプリが対象の場合は、この部分は読み飛ばしてください。

まず、サブテーブルのValueの中身(の要素)だけ抜き出します。

Sample_stbl.json
                {
                    "value": {
                        "品目コード": {
                            "type": "SINGLE_LINE_TEXT",
                            "value": "001"
                        },
                        "品名": {
                            "type": "SINGLE_LINE_TEXT",
                            "value": "みかん"
                        },
                        "数量": {
                            "type": "NUMBER",
                            "value": "1"
                        }
                    }
                }

とりあえず、値が設定される部分を変数化してサブテーブルの行を作成する関数にします。

Sample_stbl.js
     //サブテーブル行を戻す関数
    function MakeRow(h_code,h_name,amount){
       var smplRow =
            {
                "value": {
                    "品目コード": {
                        "type": "SINGLE_LINE_TEXT",
                        "value": h_code
                    },
                    "品名": {
                        "type": "SINGLE_LINE_TEXT",
                        "value": h_name
                        },
                    "数量": {
                        "type": "NUMBER",
                        "value": amount
                    }
                }
            }
        return smplRow
    };

サブテーブル項目はサブテーブル行データの配列になっているので、入力データをループでサブテーブル行に変換して配列にする関数を追加します。

Sample_stbl.js
    //入力データをサブテーブル行の配列に変換する。
    function MakeTable(in_sub_records){
        //サブテーブルデータ格納用
        var tmpRecords = [];
        //サブテーブル行データ格納用
        var tmpRow;
        //入力配列(in_sub_records)の要素数分繰り返す。
        for(var i=0; i < in_sub_records.length; i++){
            //サンプルデータを配列を1要素ずつ、サブテーブル行構造に変換
            tmpRow = MakeRow(
                        in_sub_records[i]['品目コード'],
                        in_sub_records[i]['品名'],
                        in_sub_records[i]['数量']
                        );
            //サブテーブル配列に追加する。
            tmpRecords.push(tmpRow);
        }
        return tmpRecords
    }

レコード構造の関数化

レコード構造を関数化します。サブテーブル項目はここまでで作成したサブテーブル行の配列を渡すようにします。

Sample_stbl.js
    //レコード構造を作成
    function makeRecord(siten_cd,siten_name,hai_option,meisai_tbl){
        var record = 
            {
                "record": {
                    "支店コード": {
                        "type": "SINGLE_LINE_TEXT",
                        "value": siten_cd
                    },
                    "支店名": {
                        "type": "SINGLE_LINE_TEXT",
                        "value": siten_name
                    },
                    "配送オプション": {
                        "type": "CHECK_BOX",
                        "value": hai_option
                    },
                    "明細テーブル": {
                        "type": "SUBTABLE",
                        "value": meisai_tbl
                    }
                }
            };
        return record
    };

全体

今回作成したデータ構築関数の作成を呼び出して、サンプルデータを入力するドライバ関数と、その関数をレコード編集画面表示時に実行する処理を追加します。全体としては以下のような感じです。

Sample_stbl.js
(function() {
    "use strict";
    var events = [
        // レコード編集画面表示時
        'app.record.edit.show'
    ];
    kintone.events.on(events, function(event) {
        //ドライバ関数呼び出し
        setRecord();
    });

    //テーブル構造を作成するドライバ関数
    function setRecord(){
        //サブテーブル更新用サンプルデータ配列
        var smple_sub_records = [
            {"品目コード":"003","品名":"りんご","数量":3},
            {"品目コード":"004","品名":"レモン","数量":4},
            {"品目コード":"005","品名":"バナナ","数量":5}
        ]

        //サブテーブル構造データ生成
        var subRecords = MakeTable(smple_sub_records);
        //レコード構造生成
        var m_record = makeRecord("005","サンプル支店5",["冷蔵","マルチ"],subRecords);
    
    };
 
    //入力データをサブテーブル行の配列に変換する。
    function MakeTable(in_sub_records){
        //サブテーブルデータ格納用
        var tmpRecords = [];
        //サブテーブル行データ格納用
        var tmpRow;
        //入力配列(in_sub_records)の要素数分繰り返す。
        for(var i=0; i < in_sub_records.length; i++){
            //サンプルデータを配列を1要素ずつ、サブテーブル行構造に変換
            tmpRow = MakeRow(
                        in_sub_records[i]['品目コード'],
                        in_sub_records[i]['品名'],
                        in_sub_records[i]['数量']
                        );
            //サブテーブル配列に追加する。
            tmpRecords.push(tmpRow);
        }
        return tmpRecords
    }

    //サブテーブル行を戻す関数
    function MakeRow(h_code,h_name,amount){
       var smplRow =
            {
                "value": {
                    "品目コード": {
                        "type": "SINGLE_LINE_TEXT",
                        "value": h_code
                    },
                    "品名": {
                        "type": "SINGLE_LINE_TEXT",
                        "value": h_name
                        },
                    "数量": {
                        "type": "NUMBER",
                        "value": amount
                    }
                }
            }
        return smplRow
    };

    //レコード構造を作成
    function makeRecord(siten_cd,siten_name,hai_option,meisai_tbl){
        var record = 
            {
                "record": {
                    "支店コード": {
                        "type": "SINGLE_LINE_TEXT",
                        "value": siten_cd
                    },
                    "支店名": {
                        "type": "SINGLE_LINE_TEXT",
                        "value": siten_name
                    },
                    "配送オプション": {
                        "type": "CHECK_BOX",
                        "value": hai_option
                    },
                    "明細テーブル": {
                        "type": "SUBTABLE",
                        "value": meisai_tbl
                    }
                }
            };
        return record
    };
})();

レコード構造の確認

ChromeのDevToolsを使用して、今回の関数で作成したレコード構造を確認します。

kintoneアプリに今回作成したJavascriptを登録したら、一旦レコード詳細画面でF12キーを押下してDevRoolsを起動し、ドライバ関数内の下記の行をクリックしてブレークポイントを設定します。
青い横矢印が表示されている行がブレークポイントの設定業となります。
image.png

Chromeで表示しているレコード詳細画面に戻り、レコード編集ボタンを押下します。
DevRools上のブレークポイントで処理が停止するので、コンソールでm_record変数を参照、参照結果を右クリックして「objectのコピー」 を行います。
image.png

コピーした内容をメモ帳などに貼り付けてレコード内容を確認します。

{
    "record": {
        "支店コード": {
            "type": "SINGLE_LINE_TEXT",
            "value": "005"
        },
        "支店名": {
            "type": "SINGLE_LINE_TEXT",
            "value": "サンプル支店5"
        },
        "配送オプション": {
            "type": "CHECK_BOX",
            "value": [
                "冷蔵",
                "マルチ"
            ]
        },
        "明細テーブル": {
            "type": "SUBTABLE",
            "value": [
                {
                    "value": {
                        "品目コード": {
                            "type": "SINGLE_LINE_TEXT",
                            "value": "003"
                        },
                        "品名": {
                            "type": "SINGLE_LINE_TEXT",
                            "value": "りんご"
                        },
                        "数量": {
                            "type": "NUMBER",
                            "value": 3
                        }
                    }
                },
                {
                    "value": {
                        "品目コード": {
                            "type": "SINGLE_LINE_TEXT",
                            "value": "004"
                        },
                        "品名": {
                            "type": "SINGLE_LINE_TEXT",
                            "value": "レモン"
                        },
                        "数量": {
                            "type": "NUMBER",
                            "value": 4
                        }
                    }
                },
                {
                    "value": {
                        "品目コード": {
                            "type": "SINGLE_LINE_TEXT",
                            "value": "005"
                        },
                        "品名": {
                            "type": "SINGLE_LINE_TEXT",
                            "value": "バナナ"
                        },
                        "数量": {
                            "type": "NUMBER",
                            "value": 5
                        }
                    }
                }
            ]
        }
    }
}

おわりに

実際の開発作業では、今回作成したデータ構築関数に入力できる状態に、元データを編集するまでが大変かもしれません。また、もっとスマートなデータ構築方法もあると思いますが、見た目で分かりやすいかと思いますので、まずとっかかりとして今回の方法でデータ構築関数を作成してから、スマート化していくのも良いのではないでしょうか。

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
Sign upLogin
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?