レコード編集画面にコピーボタン設置

文字列フィールドの値をコピーするボタンを設置したいと思っています。

詳細画面には設置できたのですが、追加・編集の画面に表示されません。

詳細画面以外はこの記述ではボタン設置できないのでしょうか。

初歩的な質問ですみません。アドバイス頂けますと幸いです。

 

 

(() => {

  ‘use strict’;  kintone.events.on([‘app.record.detail.show’,‘app.record.create.show’,‘app.record.edit.show’], event => {

    let CopyButton = document.createElement(‘button’);
    CopyButton.innerHTML = ‘COPY’;
    CopyButton.id = ‘ボタン設置スペース’;
    CopyButton.style.borderRadius = ‘10px’;
    CopyButton.style.marginLeft = ‘20px’;
    CopyButton.style.marginTop = ‘10px’;
    CopyButton.style.marginBottom = ‘10px’;

    let phoneNumber = kintone.app.record.getFieldElement(“コピーするフィールド”);
    CopyButton.addEventListener(‘click’, function() {
      const phoneNumberText = phoneNumber.firstElementChild.textContent;
      copytoClipboarad(phoneNumberText);
    });

 
    phoneNumber.appendChild(CopyButton);

    async function copytoClipboarad(target) {
      await navigator.clipboard.writeText(target)
      CopyButton.style.color = ‘green’
      CopyButton.style.borderColor = ‘green’;
      CopyButton.innerHTML = ‘OK’;
    };

  });
})()

    let phoneNumber = kintone.app.record.getFieldElement("コピーするフィールド");

フィールド要素を取得するの「利用できる画面」に書いてありますが、これはレコード追加、編集画面では使えません。これは基本的にレコード詳細表示画面でフィールドの装飾を変更するためのものなので、ボタンをappendChildするためのものではなく、基本的にそういった動作はスペースフィールドの要素を取得するで行わなければなりません。

その上で、

      const phoneNumberText = phoneNumber.firstElementChild.textContent;

フィールド要素取得からNodeを辿って電話番号をコピーしているようですが、これ自体が今後も動作が保証されているものではないのと、本来これはレコードの値を取得するでしなければなりません。

 

kintoneにボタンを置いて任意のフィールドをクリップボードにコピーするという記事があったので、参考になるかと思います。

肝心のAPIドキュメントの確認が漏れておりました

解説頂きありがとうございます。勉強になりました。

 

また、教えて頂いた記事で無事に実装することができました。

ありがとうございました。

 

 

このトピックはベストアンサーに選ばれた返信から 3 日が経過したので自動的にクローズされました。新たに返信することはできません。