プリントクリエイターの出力項目について

kintone カスタマイズ
1

OKAと申します。

 

kintoneにプリントクリエイターを組み込んで利用している中で、

レコード詳細画面に表示されるプリントクリエイター出力ボタン横のプルダウンメニュー項目（帳票A、帳票B）を

ログインユーザの所属組織によって変化させたいと考えております。

組織Aに属するユーザなら帳票Aのみ表示される、組織Bに属するユーザなら帳票Bのみ表示されるという動きです。

 

DOM操作によって、不要な項目を消したいと考えておりますが、

document.getElementsByClassNameを使っても値を取得することができず、躓いております。

コードは下記のような構成になっており、"kintone-app-record-headermenu-space"は取得することができますが、

子要素のclass "pcreator-sheets-select"が取得できません。

 

こちらを取得する方法をご存知の方がいらっしゃいましたら、ご教授いただきたいです。よろしくお願い致します。

 

<div class=“kintone-app-record-headermenu-space”>

<div class=“pcreator-container”>

<select class=“pcreator-sheets-select”>

<option value=“12497”>帳票A</option>

<option value=“12498”>帳票B</option>

</select>

2

OKAさん
cstapの瀧ヶ平です。

プリントクリエイターのJavaScriptでは非同期で帳票のリストを取得しているため、kintoneのイベントハンドラーの実行時にはpcreator-sheets-selectの要素は取得できない場合があります。

そのためDOM操作で変更する場合はMutationObserverなどを利用しヘッダーメニュースペース要素を監視し、子孫要素の追加されたタイミングで表示の変更処理をするなどの工夫が必要です。

指定する帳票のIDが分かっているのであれば

.pcreator-sheets-select option[value=id] {
display: none;
}

のようなスタイルを動的にページに追加することで項目の非表示ができるかと思います。

もしくはこちらをご自身でカスタマイズして表示切替機能を実装し利用するという方法もあります。

参考になりますでしょうか

3

瀧ヶ平 様

 

ご返信が遅くなり申し訳ございません。

ご回答いただきありがとうございます。

 

ご提示いただいたMutationObserverを利用した方法を試してみます。

また不明な点はご質問させていただきたく存じます。

 

OKA