お世話になります。佐藤と申します。
kintoneをきっかけにWebアプリを勉強し始めて17日目です。
制御系とWindows業務アプリの経験はあるため、一応ソースの読み書きはできます。
しかし、サンプルやコミュニティを調べても良く分からなかったため、
3つ質問させてください。
※前置きが長いです。質問は一番下にあります。
既存のWindows業務アプリのWeb化を目指し、下記のサイトなどを参考に、
下図のようなフィールドを生成しました。
《はじめようkintone API》
https://developer.cybozu.io/hc/ja/articles/201755040
《ドットインストール》
《kintoneスタイルシート記述サンプル》
https://joyzo.github.io/kintone_css/
《「51-modern-default.css」スタイルシート対応表》
●区分マスタからレコードを取得し、『ＤＭ発送』『友の会』の
二つのフィールドを、メインのアプリにJavaScriptで生成しました。
●JavaScriptソース
//*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*
//* 入力画面（初期表示）
//*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*
(function() {
"use strict";
// 《区分マスタのアプリケーションＩＤ》
var _APP_KBN_APP_ID = 31;
// 《ＤＭ発送ドロップダウン用変数》
var _DM_SEND_KBN_INFO = {
kubnKey: 'ＤＭ発送区分',
selectBoxId: 'dm_send_kbn',
selectBoxCaption: 'ＤＭ発送',
isRequired: true
};
// 《友の会ドロップダウン用変数》
var _FELLOWSHIP_KBN_INFO = {
kubnKey: '友の会区分',
selectBoxId: 'fellowship_kbn',
selectBoxCaption: '友の会',
isRequired: true
};
// 《区分選択用コントロール生成》
function createKubnSelectBox(kubnKey, selectBoxId, selectBoxCaption, isRequired) {
var appKubnParams = {
app: _APP_KBN_APP_ID,
query: 'kubn_key = "' + kubnKey + '"'
};
// 《複数行取得するため、kintone.apiはrecordsを指定》
kintone.api('/k/v1/records', 'GET', appKubnParams).then(function(resp) {
(function() {
var space = kintone.app.record.getSpaceElement('space_' + selectBoxId);
// 《ラベル生成》
if (isRequired) {
$(space).append(
$('<div>').addClass('kintoneplugin-label').text(selectBoxCaption).append(
$('<span>').addClass('kintoneplugin-require').html('*')
)
);
} else {
$(space).append(
$('<div>').addClass('kintoneplugin-label').text(selectBoxCaption)
);
}
// 《ドロップダウンのような何かを生成》
(function() {
var $selectBox = $('<select>').addClass('kintoneplugin-dropdown-list-item').attr('id', selectBoxId);
$(resp.records).each(function(index, rec){
var $option = $('<option>').addClass('kintoneplugin-dropdown-list-item-name');
$option.attr('value', rec.kubn_code.value).text(rec.kubn_text.value);
$selectBox.append($option);
});
$(space).append(
$('<div>').append(
$('<div>').addClass('kintoneplugin-select-outer').append(
$('<div>').addClass('kintoneplugin-select').append(
$selectBox
)
)
)
);
})();
})();
},
function(error) {
var errmsg = 'レコード取得時にエラーが発生しました。';
if (error.message !== undefined) {
errmsg += '' + error.message;
}
alert(errmsg);
});
}
// 《各初期表示時のイベント生成》
var eventsShow = ["app.record.create.show", "app.record.edit.show", "app.record.detail.show"];
kintone.events.on(eventsShow,
(function(e) {
// カスタムフィールド生成
createKubnSelectBox(_DM_SEND_KBN_INFO.kubnKey, _DM_SEND_KBN_INFO.selectBoxId, _DM_SEND_KBN_INFO.selectBoxCaption, _DM_SEND_KBN_INFO.isRequired);
createKubnSelectBox(_FELLOWSHIP_KBN_INFO.kubnKey, _FELLOWSHIP_KBN_INFO.selectBoxId, _FELLOWSHIP_KBN_INFO.selectBoxCaption, _FELLOWSHIP_KBN_INFO.isRequired);
return e;
}));
// 《各サブミット時のイベント生成》
var events = ["app.record.create.submit", "app.record.edit.submit"];
kintone.events.on(events,
(function(e) {
var record = e.record;
//TODO "record"内に、生成したフィールド名が無いため保留
/*
record[_DM_SEND_KBN_INFO.selectBoxId]['value'] = $('#' + _DM_SEND_KBN_INFO.selectBoxId).val();
record[_FELLOWSHIP_KBN_INFO.selectBoxId]['value'] = $('#' + _FELLOWSHIP_KBN_INFO.selectBoxId).val();
*/
return e;
}));
})();
●質問
① 最後らへんの //TODO の所なのですが、
RDBMSでいう所の、tableにcolumnを追加するような事は
kintoneで可能なのでしょうか？
② もし①が出来ないとしたら、
フォームのデザイン画面で適当なテキストボックスを置き、
『適当なテキストボックス ⇔ JavaScriptで生成したフィールド』間での
データやりとりをJavaScriptで記述するのが
kintoneの一般的な手法なのでしょうか？
③ 使い方が良く分からないのですが、
フォームのデザイン画面でドロップダウンを置き、
下記リンクの処理でドロップダウンの内容を書き換える事が
kintoneの一般的な手法なのでしょうか？
《フォームの設定の変更》
以上、よろしくお願いいたします。