新規投稿
フォローする

kViewerの明細画面に「印刷ボタン」を追加したい

1つ質問があります。
kViewerの明細画面に「印刷ボタン」を配置したいのですが、可能でしょうか
カスタマイズで実装してみたのですが、うまく表示されません。

どなたか教えていただければ幸いです。

jQuery.noConflict();
(function($) {
    'use strict';

    var pButton=document.createElement('button'); //ボタン生成
    pButton.id='aaButton'; //ボタンID
    pButton.style.height='30px'; //ボタンの高さ
    pButton.style.width='150px'; //ボタンの横幅
    pButton.innerHTML='台紙を印刷する'; //ボタンの表示名
    pButton.style.borderRadius='10px 10px 0px 0px'; //ボタンのデザイン

    pButton.onclick=function() {
        window.print();
        return false;
    };

    kv.events.view.detail.mounted= [function(state) {
        $(kv.detail.getElementByCode("PrintSpace")).appendChild(pButton);
        return state;
    }];

})(jQuery);
0

2件のコメント

Avatar
友利優希

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

トヨクモの友利と申します。

以下のコードで詳細画面に印刷ボタンを設置することができます。

(function() {

    "use strict";

    const pButton = document.createElement('button'); //ボタン生成
pButton.style.height = '30px'; //ボタンの高さ
pButton.style.width = '150px'; //ボタンの横幅
pButton.innerHTML = '印刷'; //ボタンの表示名
pButton.style.borderRadius = '10px'; //ボタンのデザイン
pButton.onclick = function() {
window.print();
};

kv.events.view.detail.mounted.push(function (state) {
       document.querySelector('.content').appendChild(pButton);
  });

})();

 

友利優希により編集されました
0
Avatar
H.Nakai

友利 様

ご連絡が遅くなりなり申し訳ございません。

教えていただいたソースコードで実現できました。
ありがとうございます。

また、何かありましたらご教授いただけると幸いです。

0
ログインしてコメントを残してください。