# ボタンを押したらコメント欄にフィールドコードの値を入れたい
**URL:** https://community.cybozu.dev/t/topic/8689
**Category:** kintone 開発相談
**Created:** [2024 年 2 月 14 日午前 5:56 UTC](https://community.cybozu.dev/t/topic/8689 "2024-02-14T05:56:16Z")
**Posts on this page:** 4
**Page:** 1
### Author:  [@scy](https://community.cybozu.dev/u/scy)
#### Post date: [2024 年 2 月 14 日午前 5:56 UTC](https://community.cybozu.dev/t/topic/8689/1 "2024-02-14T05:56:16Z")
ボタンを右上に設置し、そのボタンを押したらコメント欄に
特定のフィールドの値が入るようにしたいのですが
ボタンを押しても何も起きません。
どこが間違っているか教えていただけないでしょうか。
また、できれば宛先追加の＠をつけたうえで文字を入れたいのですが
そうした動作は可能でしょうか。
コメント欄はただ＠を付ければよいわけではないようで
宛先追加を押した＠でないと宛先にならないようなので困っています。
どなたかご教示願います。
```javascript
// レコード一覧の表示後イベント
kintone.events.on([
'app.record.detail.show',
'app.record.create.show',
'app.record.edit.show'
], (event) => {
if (document.getElementById('test_button') !== null) {
return;
}
// ボタン
const test_button = document.createElement('button');
test_button.id = 'test_button';
test_button.innerText = 'test';
// ボタンを設置
kintone.app.record.getHeaderMenuSpaceElement().appendChild(test_button);
});
// イベントハンドラーの設定
test_button.addEventListener('click', function() {
// テキストボックスへの値の入力
const comment = document.getElementById(":92.field");
comment.value += record.testフィールドコード.value;
});
})();
```
---
### Author:  [@lion](https://community.cybozu.dev/u/lion)
#### Post date: [2024 年 2 月 17 日午前 10:54 UTC](https://community.cybozu.dev/t/topic/8689/2 "2024-02-17T10:54:04Z")
いくつかポイントがあるので順にコメントします。
・test\_buttonのaddEventListenerがbuttonを定義しているブロックの外側にあります。同じブロック内に書いてください。
・kintone.events.onでは、必ずeventをreturnするようにしてください。
また、そもそもkintoneカスタマイズにおいて、DOMを直接操作することは御法度とされています。コメントを操作するAPIは存在しないので、コメント投稿APIを使うといいと思います。
( [レコードコメントを投稿する - cybozu developer network](https://cybozu.dev/ja/kintone/docs/rest-api/records/add-comment/) )
このとき、メンションはPOSTのbodyに乗せることになるので、参照するフィールドは文字列などではなく、ユーザー選択フィールドをおすすめします。
なお、おそらく要件として、何らかのフィールドに入っているユーザー名を宛先としてセットした状態で自由にコメントを記入し投稿するという挙動を想定されていると思います。
POSTを使うと、コメントを入力するフェーズがなくなってしまうので、プロンプトなどを使ってコメント入力を追加してあげる必要があります。
以下は一例です。ご参考になれば幸いです。
```javascript
(function() {
// レコード一覧の表示後イベント
kintone.events.on([
'app.record.detail.show',
'app.record.create.show',
'app.record.edit.show'
], (event) => {
if (document.getElementById('test_button') !== null) {
return event;
}
// ボタン
const test_button = document.createElement('button');
test_button.id = 'test_button';
test_button.innerText = 'test';
// イベントハンドラーの設定
test_button.addEventListener('click', function() {
const prompt = window.prompt('コメントを入力してください。');
if (prompt === null) {
return;
}
// コメントの投稿
const body = {
app: kintone.app.getId(),
record: kintone.app.record.getId(),
comment: {
text: prompt,
mentions: [
{
code: event.record["user"].value[0].code,
type: 'USER'
},
]
}
};
kintone.api(kintone.api.url('/k/v1/record/comment.json', true), 'POST', body, (resp) => {
// success
console.log(resp);
}, (error) => {
// error
console.log(error);
});
});
// ボタンを設置
kintone.app.record.getHeaderMenuSpaceElement().appendChild(test_button);
return event;
});
})();
```
---
### Author:  [@scy](https://community.cybozu.dev/u/scy)
#### Post date: [2024 年 2 月 20 日午前 12:09 UTC](https://community.cybozu.dev/t/topic/8689/3 "2024-02-20T00:09:20Z")
ありがとうございます。
コードも詳細に頂ありがとうございました。
こちらを参考にやってみたいと思います。
---
### Author:  [@system](https://community.cybozu.dev/u/system)
#### Post date: [2024 年 2 月 23 日午前 12:10 UTC](https://community.cybozu.dev/t/topic/8689/4 "2024-02-23T00:10:14Z")
このトピックはベストアンサーに選ばれた返信から 3 日が経過したので自動的にクローズされました。新たに返信することはできません。