カスタマイズビュー上での入力について

kintone カスタマイズ
1

カスタマイズビュー上でチェックボックスにチェックを入れたり外したりを行いたいです。

最終的にはカスタマイズビュー上で、レコードの合計を表示させたく、チェックボックスが入っているレコードは計算対象。チェックボックスが外れているレコードは計算対象外としたいです。

チェックボックスの表示までは出来ているのですが、実際どのようにして入力処理を書けばいいかで詰まっております。

サンプルで実装できるコードなどがございましたらご教授いただけないでしょうか。

2

daikonsanさん

こんにちは。

 

大方の実装されたいことは掴めたのですが、もう少しどこで躓かれているのかを記載いただくとご案内しやすいです。

チェックボックスの表示までできているとのことで

差し支えない範囲でその辺りのソースコードを添付いただくと更に修正の方向性をお答えしやすいです。

3

koichi 様

 

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

現在、handsontableを使ってチェックボックスの表示、チェックのオンオフまでは出来たのですが

チェックボックスをどのようにして計算対象外か（チェックの有無判定）判定するところで詰まっております。

 

var container = document.getElementById(‘my-customized-view’);

var hot = new Handsontable(container, {

    data: records,

    minSpareRows: 0,

    //ヘッダー

    colHeaders: [“計算対象外”,“年”, "月  ", “請求合計”],

    fillHandle: false,  //フィルハンドル無効化

    autoColumnSize: true,   //カラムの幅自動調整有効化

    columnSorting: true, //カラム名を押してソート有効化

    sortIndicator: true, //現在のソート向きを表示

    //必要に応じてreadOnlyの指定

    columns: [

        {

            type: “checkbox”,

            label: {

                value: “”

            }

        },

        {data: “年.value”, readOnly: true},

        {data: “月.value”, readOnly: true},

        {data: “請求合計.value”, readOnly: true},

    ]

}

4

コードありがとうございます。

例えば、テーブルが変更されたときに処理する場合、「afterChange」を使います。

テーブル全てのデータソースを取得するには、「hot.getSourceData()」を使います。

 

これらを組み合わせて、「afterChange」の中で「hot.getSourceData()」の全行をループして

先頭列（[0]番目）がtrueの時に、請求合計を加算するという流れで実装可能と思います。

columns: [
// 省略
],

afterChange: function (changes, source) {

    // 初回ロード時は何もしない
    if (source === 'loadData') return;

  // ここでhot.getSourceData()の全行をループして、先頭列trueの時に請求合計を加算する処理

}