回答の条件によって別フィールドの表示/非表示を切り替えるプログラムについて

kintone カスタマイズ
1

回答の条件によって別フィールドの表示/非表示を切り替えるプログラムについて質問があります。

[参考にしたURL]
https://developer.cybozu.io/hc/ja/articles/202377614-%E5%9B%9E%E7%AD%94%E3%81%AE%E6%9D%A1%E4%BB%B6%E3%81%AB%E3%82%88%E3%81%A3%E3%81%A6%E5%88%A5%E3%83%95%E3%82%A3%E3%83%BC%E3%83%AB%E3%83%89%E3%81%AE%E8%A1%A8%E7%A4%BA-%E9%9D%9E%E8%A1%A8%E7%A4%BA%E3%82%92%E5%88%87%E3%82%8A%E6%9B%BF%E3%81%88%E3%82%8B 

上記URLを参考に、テキストボックスのアイテムにチェックを付けた際に
チェックボックスを表示させるスクリプトを作成しましたが、
どれか一つにチェックした場合は正しくテキストボックスが表示されるのですが複数チェックした場合にはアイテムN（Nの数が大きい数字）のテキストボックスしか表示されない動きとなっております。
スクリプトの作成方法につきましてご教授いただけますと幸いです。

・・・チェックボックスの内容・・・
アイテム1
アイテム2
アイテム3

 

[実現したいこと]
チェックボックスの内容をチェックした際に、文字列のボックスを表示させたい。
例えば、アイテム1 と アイテム3に✓を入れた場合は、1、3のテキストボックスが
表示される。

・・・チェックボックスの内容（実現したい形）・・・
✓アイテム1 [テキストボックス1] ← 表示される
アイテム2
✓アイテム3 [テキストボックス3] ← 表示される

 

—準備したスクリプト—

//レコードの追加、編集、詳細画面で適用する
var events = [‘app.record.detail.show’,
‘app.record.create.show’,
‘app.record.create.change.item1TxtBox’,
‘app.record.create.change.item2TxtBox’,
‘app.record.create.change.item3TxtBox’,
‘app.record.edit.show’,
‘app.record.edit.change.item1TxtBox’,
‘app.record.edit.change.item2TxtBox’,
‘app.record.edit.change.item3TxtBox’,];

kintone.events.on(events, function(event) {

var record = event.record;

//”アイテム1～3”になにも選択されていなかった場合は何もフィールドを表示しない
var workType = record[‘workType’][‘value’];
if (workType.length == 0) {
kintone.app.record.setFieldShown(‘item1TxtBox’, false);
kintone.app.record.setFieldShown(‘item2TxtBox’, false);
kintone.app.record.setFieldShown(‘item3TxtBox’, false);
}

//”アイテム1～3”にすべてチェックが入った場合 (※うまく動作しません）
var workType = record[‘workType’][‘value’];
if (workType.length == 3) {
kintone.app.record.setFieldShown(‘item1Txt’, true);
kintone.app.record.setFieldShown(‘item2Txt’, true);
kintone.app.record.setFieldShown(‘item3Txt’, true);
}

//「アイテム1」と「アイテム2」が選択された場合は (※うまく動作しません）
// ※同様にアイテム1とアイテム3、アイテム2とアイテム3 のパターンも動作しません
for (var i = 0; i < workType.length; i++) {
if (workType[i] == ‘アイテム1’ && workType[i] == ‘アイテム2’) {
kintone.app.record.setFieldShown(‘item1Txt’, true);
kintone.app.record.setFieldShown(‘item2Txt’, true);
} else {
kintone.app.record.setFieldShown(‘item1Txt’, false);
kintone.app.record.setFieldShown(‘item2Txt’, false);
}
}

//「アイテム1」が選択された場合「アイテム1」のテキストボックスを表示させる （※単体では動作）
for (var i = 0; i < workType.length; i++) {
if (workType[i] == ‘アイテム1’) {
kintone.app.record.setFieldShown(‘item1Txt’, true);
} else {
kintone.app.record.setFieldShown(‘item1Txt’, false);
}
}

//「アイテム2」が選択された場合「アイテム2」のテキストボックスを表示させる （※単体では動作）
for (var i = 0; i < workType.length; i++) {
if (workType[i] == ‘アイテム2’) {
kintone.app.record.setFieldShown(‘item2Txt’, true);
} else {
kintone.app.record.setFieldShown(‘item2Txt’, false);
}
}

//「アイテム3」が選択された場合「アイテム3」のテキストボックスを表示させる （※単体では動作）
for (var i = 0; i < workType.length; i++) {
if (workType[i] == ‘アイテム3’) {
kintone.app.record.setFieldShown(‘item3Txt’, true);
} else {
kintone.app.record.setFieldShown(‘item3Txt’, false);
}
}

2

Sophia さん

配列内の値をチェックするには、indexOf を使うと便利です。

(function() {
"use strict";
var events = ['app.record.detail.show',
'app.record.create.show',
'app.record.create.change.workType',
'app.record.edit.show',
'app.record.edit.change.workType',
];
kintone.events.on(events, function(event) {
var record = event.record;
var workType = record['workType']['value'];
if (workType.indexOf('アイテム1') >= 0) {
kintone.app.record.setFieldShown('item1Txt', true);
} else {
kintone.app.record.setFieldShown('item1Txt', false);
}
if (workType.indexOf('アイテム2') >= 0) {
kintone.app.record.setFieldShown('item2Txt', true);
} else {
kintone.app.record.setFieldShown('item2Txt', false);
}
if (workType.indexOf('アイテム3') >= 0) {
kintone.app.record.setFieldShown('item3Txt', true);
} else {
kintone.app.record.setFieldShown('item3Txt', false);
}
return event;
});
})();

 

更に、表示制御に値の有無条件を直接指定できます。

kintone.app.record.setFieldShown('item1Txt', workType.indexOf('アイテム1') >= 0);
kintone.app.record.setFieldShown('item2Txt', workType.indexOf('アイテム2') >= 0);
kintone.app.record.setFieldShown('item3Txt', workType.indexOf('アイテム3') >= 0);

対象項目が多い場合は、ループ処理します。

var items = {
'アイテム1': 'item1Txt',
'アイテム2': 'item2Txt',
'アイテム3': 'item3Txt'
};
Object.keys(items).forEach(function(item) {
kintone.app.record.setFieldShown(items[item], workType.indexOf(item) >= 0);
});
3

rex0220 様

 

アドバイスありがとうございます。

頂きました内容で解決いたしました。 御礼申し上げます。