複数ボタンを設置　各ボタンごとに異なる変更をしたい

kintone カスタマイズ
1

〇やりたいこと

“工程１”のレコードを一覧で絞り込み、工程２に変更するボタンで工程２に変更する

“工程２”のレコードを一覧で絞り込み、工程３に変更するボタンで工程３に変更する

という動作をおこないたいです。

 

一覧で絞り込んだレコードのみを更新する方法 を参考に下記のコードを、

(function() {
"use strict";
kintone.events.on('app.record.index.show', function(event){
var oldButton = document.getElementById('updateButton');
if(oldButton !== null) oldButton.parentNode.removeChild(oldButton);
var button = document.createElement('button');
button.innerHTML = '工程２に変更する';
button.id = 'updateButton';
kintone.app.getHeaderMenuSpaceElement().appendChild(button);
button.addEventListener('click', function(){
kintone.api(kintone.api.url('/k/v1/records', true), 'PUT', {
app: kintone.app.getId(),
records: event.records.map(function(record){
return {
id: record.$id.value,
record: {
進捗: {
value: '工程２'}

}
};
})
}).then(function(){
alert('工程２に変更する');
location.reload();
});
});
return event;
});

複数のボタンを設置 を参考に下記のコードを

(function() { 
"use strict";
kintone.events.on('app.record.index.show', function(event) {
if (document.getElementById('my_index_button') !== null) {
return;
}
var myIndexButton = document.createElement('button');
myIndexButton.id = 'my_index_button';
myIndexButton.innerHTML = '工程２に変更する';

var myIndexButton2 = document.createElement('button');
myIndexButton2.id = 'my_index_button2';
myIndexButton2.innerHTML = '工程３に変更する';

var myIndexButton3 = document.createElement('button');
myIndexButton3.id = 'my_index_button3';
myIndexButton3.innerHTML = '工程４に変更する';

var myIndexButton4 = document.createElement('button');
myIndexButton4.id = 'my_index_button4';
myIndexButton4.innerHTML = '工程５に変更する';

// ボタンを配置するスペース
var el = kintone.app.getHeaderMenuSpaceElement();

// スペースに作成したボタンを追加
el.appendChild(myIndexButton);
el.appendChild(myIndexButton2);
el.appendChild(myIndexButton3);
el.appendChild(myIndexButton4);
});
})();

書いたのですが、合わせ方がわからず、動かなくなってしまいます。

それぞれ単体ではうまく動きました。

 

初心者のため、基礎的な部分が理解できていないのだと思いますが、作りながら覚えていければと思っております。

ご教示の程、宜しくお願い致します。

 

2

こんにちは！

button.addEventListener(‘click’, function(){～～});

のbuttonをmyIndexButton～myIndexButton4に変更すると良いと思います。

たとえば
myIndexButton2.addEventListener(‘click’, function(){～～});
のような感じです。

 

3

juridon様

こんにちは。ご教示ありがとうございます。

buttonの部分を書き換えたら、うまく作動しました。

また何かありましたら、宜しくお願い致します。