kintoneの一覧画面のヘッダースペースに、ドロップダウンを追加します。
javascriptでのカスタマイズとなります。
事前準備
①フォームへドロップダウンを追加
フィームで、ドロップダウンを作成してください。
フォームのドロップダウンの選択内容を一覧に追加します。
②ライブラリーの追加
URL指定で、以下のライブラーを追加してください。フィールド一覧の取得に使用しています。
https://js.cybozu.com/kintone-rest-api-client/3.1.16/KintoneRestAPIClient.min.js
プログラム
(function() {
'use strict';
kintone.events.on('app.record.index.show', async function(event) {
const client = new KintoneRestAPIClient();
let Fields = await client.app.getFormFields({ app: "100" });
//console.log(Fields);
let dropdown = Fields.properties.ドロップダウン.options; //フィールドコードで取得
//取得したドロップダウンのオプションを取得し、ソート
let result = Object.keys(dropdown).map(function(key) {
return {
title:key,
key:dropdown[key]
};
//ソート
}).sort(function(a, b) {
return (a.key.index < b.key.index) ? -1 : 1; //オブジェクトのindexでソート
});
//console.log(result);
let selectBox = document.createElement('select');
Object.values(result).forEach(function(data,i) {
let opt = document.createElement('option');
opt.value = data.title;
opt.text = data.title;
selectBox.appendChild(opt);
})
selectBox.className = "kintoneplugin-dropdown";
kintone.app.getHeaderMenuSpaceElement().appendChild(selectBox);
});
})();
kintone
一覧のヘッダースペースに、ドロップダウンを設置しています。
フォームに配置した、ドロップダウンの内容を取得し、オプションに配置しています。
プログラムでは、フィールド名が「ドロップダウン」のドロップダウンのプロパティを取得しています。
フォームの内容をそのまま表示しているため、一覧の検索に使用できます。