チェックボックスについて

初めての投稿となります。小林あいと申します。

チェックボックスで表示非常時について を参考にしたいですが、複雑すぎて、初心者の私には応用すらできなくて、先輩かたどうかご指導お願い致します。

やりたいこと:契約プラン:Aプランにチェック入れたら、Aコースを選択しないとエラーとなり、選択したら、エラーが消える。また、チェックを外したら、Aコースで選択した項目もリセットされる。同じ動きをBコースでも実現したい。

参照のページではグループとほかの項目もいっぱいあって、自立で組めると思いましたが、難しい過ぎて、さっぱり応用ができなくて・・・

groupFieldCodeなどを削除して、ほかのコードはどこをどうすれば動くでしょうか?お手数をおかけますが、教えていただくと幸いです。どうぞよろしくお願い致します。

(function() {
"use strict";
var fieldsInfo = [
{groupFieldCode:'Aプラン',courseFieldCode:'Aコース',courseInfo: {'aコース':'aコース料金','bコース':'bコース料金','cコース':'cコース料金', } },
{groupFieldCode:'Bプラン',courseFieldCode:'Bコース',courseInfo: {'dコース':'dコース料金','eコース':'eコース料金','fコース':'fコース料金', } },
//{groupFieldCode:'Cプラン',courseFieldCode:'Cコース',courseInfo: {'gコース':'gコース料金','hコース':'hコース料金','iコース':'iコース料金', } },
//{groupFieldCode:'Dプラン',courseFieldCode:'Dコース',courseInfo: {'jコース':'jコース料金','kコース':'kコース料金','lコース':'lコース料金', } },
];
//レコードの追加、編集、詳細画面で適用する
varevents = ['app.record.detail.show',
'app.record.create.show',
'app.record.create.change.契約プラン',
'app.record.edit.show',
'app.record.edit.change.契約プラン',
];
fieldsInfo.forEach(function(planData) {
events.push('app.record.create.change.'+ planData.courseFieldCode);
events.push('app.record.edit.change.'+ planData.courseFieldCode);
});
kintone.events.on(events,function(event) {
varrecord = event.record;
varplanValue = record['契約プラン']['value'];
fieldsInfo.forEach(function(planData) {
varplanState = planValue.indexOf(planData.groupFieldCode) >=0;
kintone.app.record.setFieldShown(planData.groupFieldCode, planState);
if(!planState) {
// 非選択プランのコース選択をリセット
record[planData.courseFieldCode]['value'] = [];
// プラン選択時の表示のため、グループを開いておく
kintone.app.record.setGroupFieldOpen(planData.groupFieldCode,true);
}
varcourseValue = record[planData.courseFieldCode]['value'];
Object.keys(planData.courseInfo).forEach(function(courseFieldCode) {
varcourcePriceName = planData.courseInfo[courseFieldCode];
varcourceState = planState && (courseValue.indexOf(courseFieldCode) >=0);
kintone.app.record.setFieldShown(courcePriceName, courceState);
});
});
returnevent;
});
kintone.events.on(['app.record.create.submit','app.record.edit.submit'],function(event) {
varrecord = event.record;
varplanValue = record['契約プラン']['value'];
fieldsInfo.forEach(function(planData) {
varplanState = planValue.indexOf(planData.groupFieldCode) >=0;
if(planState && record[planData.courseFieldCode]['value'].length ===0) {
kintone.app.record.setGroupFieldOpen(planData.groupFieldCode,true);
record[planData.courseFieldCode]['error'] ='必須です。';
event['error'] ='コース必須エラー';
}
});
returnevent;
});
})();

 

小林さん

こんにちは。
参考にしようとしたところのコードは綺麗で、この形で書くのがよいとは思いますが、
コードあまり書かない方などが、いきなりこのコードを応用して処理を書こうとしても、
処理の内容を追い切れず、おそらく挫折してしまう気がします。。。

基本的には、やりたいことを細分化し、1つ1つ作っていくのが良いかと思います。

また、契約プランをA,B両方選択する場合があるのかなどでも、処理が変わってきます。
参考元だと、複数プランを選択する可能性などもあるので、チェットボックスにし、
各チェックに応じた判定を行っています。

複数選択する可能性がないのであれば、最初は契約プランをドロップダウンにして、
値が一つになるようにした処理を作られる方が、簡単かと思います。

一旦チェックを入れた契約プランに応じたエラー制御に関してコメントするのですが、
この処理に限定した場合、元のコードでいうとごく一部の処理だけを使うだけとなります。

具体的には下記だけで動くと思います。

(function() {
"use strict";
var fieldsInfo = [
{groupFieldCode: 'Aプラン', courseFieldCode: 'Aコース' },
{groupFieldCode: 'Bプラン', courseFieldCode: 'Bコース' }
];

kintone.events.on(['app.record.create.submit', 'app.record.edit.submit'], function(event) {
var record = event.record;
var planValue = record['契約プラン']['value'];

fieldsInfo.forEach(function(planData) {
var planState = planValue.indexOf(planData.groupFieldCode) >= 0
if (planState && record[planData.courseFieldCode]['value'].length === 0) {
record[planData.courseFieldCode]['error'] = '必須です。';
event['error'] = 'コース必須エラー';
}
});
return event;
});
})();

詳しい処理の解説は、コードを書かれたrex0220さんが解説しているので、そこから
拾ってもらうのが良いかと思います。

ただ大きなお世話なのかもしれないですが、いきなりこちらを使うより、仮に処理が
効率的ではなくても、基礎的なところから始めた方がよいと思います。

最初にも少し書いたのですが、処理やアプリ設計は運用によって変わるので、
それによって今後修正する可能性を考えると、多少の理解は必要かと。

参考ですが、こちらにチュートリアルなども公開されており、JavaScript のところを一通りやると、
チェックボックス値に応じたエラー制御くらいはできるようになるかなと思うので、機会があれば
一度やってみてもよいかもしれないです。

サクラエビ 様

お世話になっております。

ご丁寧に詳細なコードまで記述頂き、誠にありがとうございます。

色々とアドバイスもいただき、本当におっしゃる通りでございます。基礎的な考え方もご参考にしつつ、今後進めていけたらと思います。

 

小林さん

元のコードを読んで、ざっくりと修正しているので、もしかするといらないものなどあるかも

しれないですが、動かなかったら言ってください。

ある程度基礎がわかると、修正もしやすくなってくると思うので、がんばってください!