![見出し画像](https://assets.st-note.com/production/uploads/images/146802057/rectangle_large_type_2_ea9d001a66f64f46a14fc0c2b7c740ba.png?width=1200)
テーブル内の古いデータを一括削除するボタンの設置
やりたいこと
Kintoneアプリのフォームにあるテーブルデータを日付で判定して1年以上前の日付の行を一括で削除したい。
kintoneではレコードの検索と一括削除機能はあるのですが、各レコード内のテーブルのデータは、レコードがある限りずーっと残ります。
テーブルデータの日付が「1年以上前」の古いデータは一括してテーブルから削除する機能をフォームに追加します。
このカスタマイズは、レコード編集画面で動作します。
デモ画面
デモ画面では、レコード編集画面で「期限切れデータ削除」ボタンをクリックすると、本日から保存日数(365日)を差し引いた日付より前のデータ(2行と4行目のデータ)を削除してテーブルを再表示します。
削除実行後に「保存」ボタンを押せば、テーブルの行削除が確定します。
「キャンセル」ボタンを押せば元の状態に戻ります。
![](https://assets.st-note.com/production/uploads/images/146727580/picture_pc_9096b2d33525ca070af6728e49233ee6.gif?width=1200)
フォームの設定
フォームの設定では、フィールド名(フィールドコード):フィールド型を以下の様に設定して下さい。
テーブル内の実際のフィールドは自由に設定して下さい。
但し「日付」フィールドは必ず必要です。
![](https://assets.st-note.com/img/1720515318079-KWLtrrG0U2.png?width=1200)
重要なのは。★印のフィールドのフィールドコードをJavascriptの設定と合わせることです。
★テーブル(テーブル)
★日付(日付):日付型
データ(データ):文字列1行
★保存日数(保存日数):初期値=365
★スペース(要素ID=Button_Space)
サンプルのJavascriptコード
初期設定のフィールドコードを、kintoneフォームのフィールドコード名と合わせる様にして下さい。
エラーになる原因は、初期設定のフィールドコードがフォームの設定内容と異なるケースがほとんどです。
ボタンの名前を変更したい場合は、以下の行を修正して下さい。
deleteButton.innerText = '期限切れデータ削除';
その他の部分は、修正する必要はありません。
/* サブテーブルの旧い行を削除する */
(function() {
'use strict';
// 初期設定
const CONFIG = {
SUB_TABLE: 'テーブル', // サブテーブルのフィールドコード
DATE_FIELD: '日付', // 日付フィールドのフィールドコード
DAYS_FIELD: '保存日数' // 日数フィールドのフィールドコード
};
// 期限切れデータを削除する関数
function deleteExpiredData(record) {
const daysAgo = record[CONFIG.DAYS_FIELD].value;
const cutoffDate = new Date();
cutoffDate.setDate(cutoffDate.getDate() - daysAgo);
const subTable = record[CONFIG.SUB_TABLE].value;
const filteredSubTable = subTable.filter(row => {
const rowDate = new Date(row.value[CONFIG.DATE_FIELD].value);
return rowDate >= cutoffDate;
});
record[CONFIG.SUB_TABLE].value = filteredSubTable;
kintone.app.record.set({ record: record });
}
// イベントハンドラー
kintone.events.on(['app.record.edit.show'], function(event) {
const deleteButton = document.createElement('button');
deleteButton.innerText = '期限切れデータ削除';
deleteButton.style.marginTop = '36px';
const subTableSpace = kintone.app.record.getSpaceElement('Button_Sapace');
if (subTableSpace) {
subTableSpace.appendChild(deleteButton);
}
deleteButton.addEventListener('click', function() {
deleteExpiredData(event.record);
});
return event;
});
})();
カスタマイズした感想
本カスタマイズを実装した経緯は、レコード内のテーブルの値を集計する際に「1年以上前のデータが集計の邪魔です」との要望から実装しました。
人間がテーブルの各行を目視して不要なデータを削除する操作では間違いが起こり易いので、経過日数判定で一括削除できるようにしたものです。
別記事のテーブル内データのソートのカスタマイズと組み合わせれば、より効率的で正確なデータ保守が可能になるかもしれません。
今回も最後まで読んで頂いて、ありがとうございました。
よろしければサポートお願いします! いただいたサポートは、note記事制作の活動費に使わせていただきます!