こんにちは
現在、初心者ながらも下記のようなプラグインを開発しております。
＜機能＞
アプリ一覧に設置されたボタンを選択すると別のタブでリンクを開く
＜詳細＞
ボタンはデフォルトで３つ設置されておりプラグインの設定画面で１、ボタン名２、リンクを設定するとアプリの詳細画面にボタンが設置され、そこから別のページを開くことができる簡単なアプリです。
＜やりたいこと＞
上記の機能は無事実装できましたが、例えばボタンを３つの内、２つだけ使用したいという場合があると思います。
実装したいのは２つの値だけ設定すると、２つのみボタン表示されるという機能です。
現状、３つのボタンに設定値を入れないとプラグインの設定で「必須項目が設定されていません。」と表示され、ボタンがすべて表示されません。
なにか解決方法などありますでしょうか？
プラグイン本体
(function (pluginId) {
"use strict";
let config = kintone.plugin.app.getConfig(pluginId)
console.log(config);
kintone.events.on('app.record.index.show', function (event) {
//ボタン１
var myIndexButton_1 = document.createElement('button');
myIndexButton_1.id = 'my_index_button_1';
myIndexButton_1.innerText = config['name_1'];
myIndexButton_1.onclick = function () {
window.open(config['link_1'], '_blank');
}
//ボタン２
var myIndexButton_2 = document.createElement('button');
myIndexButton_2.id = 'my_index_button_2';
myIndexButton_2.innerText = config['name_2'];
myIndexButton_2.onclick = function () {
window.open(config['link_2'], '_blank');
}
//ボタン３
var myIndexButton_3 = document.createElement('button');
myIndexButton_3.id = 'my_index_button_3';
myIndexButton_3.innerText = config['name_3'];
myIndexButton_3.onclick = function () {
window.open(config['link_3'], '_blank');
}
document.getElementsByClassName('contents-actionmenu-gaia')[0].appendChild(myIndexButton_1);
document.getElementsByClassName('contents-actionmenu-gaia')[0].appendChild(myIndexButton_2)
document.getElementsByClassName('contents-actionmenu-gaia')[0].appendChild(myIndexButton_3)
});
})(kintone.$PLUGIN_ID);
manifest.json
{
"manifest_version": 1,
"version": 1,
"type": "APP",
"name": {
"ja": "アプリ間タブ切り替えプラグイン",
"en": "App TAB change Plugin"
},
"description": {
"ja": "レコード一覧から指定のアプリへ切り替えるプラグイン",
"en": "Place TAB change Button"
},
"icon": "img/icon.png",
"desktop": {
"js": [
"js/tab_change.js"
]
},
"config": {
"html": "html/config.html",
"js": [
"js/config.js"
],
"required_params": [
"name_1",
"link_1",
"name_2",
"link_2",
"name_3",
"link_3"
]
}
}
config.js
(function (pluginId) {
"use strict";
window.addEventListener('DOMContentLoaded', function () {
console.log(kintone.plugin.app.getConfig(pluginId));
let config = kintone.plugin.app.getConfig(pluginId);
if (typeof (config['name_1']) !== 'undefined') {
document.getElementById('name_1').value = config['name_1'];
}
if (typeof (config['link_1']) !== 'undefined') {
document.getElementById('link_1').value = config['link_1'];
}
if (typeof (config['name_2']) !== 'undefined') {
document.getElementById('name_2').value = config['name_2'];
}
if (typeof (config['link_2']) !== 'undefined') {
document.getElementById('link_2').value = config['link_2'];
}
if (typeof (config['name_3']) !== 'undefined') {
document.getElementById('name_3').value = config['name_3'];
}
if (typeof (config['link_3']) !== 'undefined') {
document.getElementById('link_3').value = config['link_3'];
}
document.getElementById("button_submit").onclick = function () {
let setName1 = document.getElementById("name_1");
let setlink1 = document.getElementById("link_1");
let setName2 = document.getElementById("name_2");
let setlink2 = document.getElementById("link_2");
let setName3 = document.getElementById("name_3");
let setlink3 = document.getElementById("link_3");
let config = {
"name_1": setName1.value,
"link_1": setlink1.value,
"name_2": setName2.value,
"link_2": setlink2.value,
"name_3": setName3.value,
"link_3": setlink3.value
};
kintone.plugin.app.setConfig(config);
window.alert("保存しました");
};
});
})(kintone.$PLUGIN_ID);
config.html
<html>
<body>
<h1>設定画面</h1>
<div id="form">
<div>
<label for="text">ボタン名を入力１：</label>
<input type="text" id="name_1">
</div>
<div>
<label for="text">遷移先のリンクを設定１：</label>
<input type="text" id="link_1">
</div>
<div>
<label for="text">ボタン名を入力２：</label>
<input type="text" id="name_2">
</div>
<div>
<label for="text">遷移先のリンクを設定２：</label>
<input type="text" id="link_2">
</div>
<div>
<label for="text">ボタン名を入力３：</label>
<input type="text" id="name_3">
</div>
<div>
<label for="text">遷移先のリンクを設定３：</label>
<input type="text" id="link_3">
</div>
<div class="button">
<button type="button" id="button_submit">保存</button>
</div>
</div>
</body>
</html>