新規投稿
フォローする

一覧画面でドロップダウンをjsで作成したが動かない

いつもお世話になっております。

現在一覧画面にドロップダウンを表示し中に新規と既存を入れました。

新規ならレコードの新規を表示し既存なら既存を表示したいのですがうまくいっていない状況です。

下記が現在のコードになります。

ご回答よろしくお願いします。

(function () {
'use strict';

kintone.events.on("app.record.index.show", function (event) {

var option1 = document.createElement('option');
option1.value = '1';
option1.text = '新規';

var option2 = document.createElement('option');
option2.value = '2';
option2.text = '既存';


var label = document.createElement('select');
label.id = 'dropdown';
label.setAttribute('onchange', 'this.select()');
label.appendChild(option1);
label.appendChild(option2);
kintone.app.getHeaderMenuSpaceElement().appendChild(label);

var dropdown = document.getElementById("dropdown");
if(dropdown==='新規'){
event.record.判別項目.value==='新規';
}else if(dropdown=='既存'){
event.record.判別項目.value==='既存';
}
return event;
});
})();
0

7件のコメント

Avatar
江田篤史

翼さん

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

labelにonchangeプロパティをセットすればよいかと思います。
https://developer.mozilla.org/ja/docs/Web/API/GlobalEventHandlers/onchange

また、条件分岐にはvalue属性を用いると良いかと思います。
https://developer.mozilla.org/ja/docs/Web/HTML/Element/input#htmlattrdefvalue

labelとdropdownには同じ要素が入ると思うので、dropdownは省いてしまってよいかと思います。

// ...

var label = document.createElement('select');
label.id = 'dropdown';
label.appendChild(option1);
label.appendChild(option2);
label.onchange = function(e) {
  if (e.target.value === '1') {
    event.record.判別項目.value='新規';
  } else if (e.target.value == '2') {
    event.record.判別項目.value='既存';
  }
}
document.body.appendChild(label);
江田篤史により編集されました
2
Avatar
harada
 event.record.判別項目.value==='新規';

===は代入ではなくて、同じ値かを調べるときに使うものです。

 

一覧ページで、動作させたいようですが、表示を切り替えたいという話なのでしょうか?特定のレコードのデータを修正したいと言うことなのでしょうか?実現したいことがわかりませんでした。

 vent.record.判別項目.value==='既存';

江田さんの例で eventと ventのtypoになっているようです。

2
Avatar
江田篤史

haradaさん

ご指摘ありがとうございます。

仰る通りでした。

修正いたします。

2
Avatar

江田さんharadaさんご回答ありがとうございます。

江田さん

上記でのコードを入力したのですがドロップダウンが消えてしまいました。デバックで確認したところ label.onchange = function(e)の中の条件に入ってきていない状況でした。

特にエラーとかはないのですが対処ほうがわからない状況です。

(function () {
'use strict';

kintone.events.on("app.record.index.show", function (event) {

var option1 = document.createElement('option');
option1.value = '1';
option1.text = '新規';

var option2 = document.createElement('option');
option2.value = '2';
option2.text = '既存';


var label = document.createElement('select');
label.id = 'dropdown';
label.appendChild(option1);
label.appendChild(option2);
label.onchange = function(e) {
if (e.target.value === '1') {
event.record.判別項目.value='新規';
} else if (e.target.value == '2') {
event.record.判別項目.value='既存';
}
};
document.body.appendChild(label);
return event;
});
})();
0
Avatar

haradaさん

説明不足になり大変申し訳ございません。

一覧画面にドロップダウンを作成し、中に新規と既存をいれ

新規と既存で画面を切り替えたいと考えています。

現在うまくいっていない状況で上記のコードで何かアドバイスを頂けたら幸いです。

よろしくお願いします。

0
Avatar
たねまき
document.body.appendChild(label);

のところは、当初記述されていた、

kintone.app.getHeaderMenuSpaceElement().appendChild(label);

のままで大丈夫だと思います。

2
Avatar
江田篤史

たねまきさん

ご指摘ありがとうございます。
仰るとおりでした。

 

翼さん

もろもろ間違っていて、混乱を招いてしまって申し訳ございません。

2
サインインしてコメントを残してください。