【kintone TIPS】レコードの再利用ボタンを使用できないようにする２つの方法

2019.08.26
kintone

kintone_tip2_title
kintoneの初心者向けにtipsを紹介していきます。
主にJavascriptによるカスタマイズで、なるべく実例を紹介していきます。

なおカスタマイズに必要となる前提部分は省いています、初心者向けと書いたものの多少はJavascriptによるカスタマイズ方法を理解している人向けです。

今回の内容は私もよく仕事で何とかしてくれと相談を受けた、レコード再利用ボタンの制御方法についてです。

1. 厄介なレコード再利用ボタン
2. その1：再利用ボタンを画面から消す
3. その2：再利用ボタンが押されたら、強制的に戻す
- 3.1. javascriptのコード
4. まとめ

厄介なレコード再利用ボタン

レコードの編集画面には、下記の画像のところに「再利用する」というボタンがあります。
reuse_test

このボタン、現在のデータをコピーして再利用できるという便利なボタンですが、編集ボタンの横にあるせいで間違ってコピーしてしまい、知らないうちに重複したレコードを作成してしまうという事故がよく起こります。

場合によっては、うっかりデータを重複させてしまったりと問題になりかねないこのボタンなんですが、kintoneではこのボタンの使用権限の有無を設定できません。

そこで、javascriptでこのボタンを使用できないようにします。
今回は２つ方法を紹介します。

その1：再利用ボタンを画面から消す

再利用ボタンが表示されているから押してしまう訳で、なら消してしまおうという方法です。

kintoneはJavascriptを読み込ませる事が出来るので「DOM操作」が可能です。

DOMを簡単に説明すると

「Document Object Model」の略。
HTMLなどのドキュメントにJavaScriptからアクセスするための仕組みで、JavaScriptを使用してHTMLの変更が出来る。

つまり「DOM」を操作する事でkintoneでは通常触れないHTML部分の変更をJavascriptを通して可能になるという事です。
実際どのようになるかは下記の画像の通りになります。

このとおり、ページが読み込まれた瞬間に再利用ボタンが消えている事がわかります。

javascriptのコード

javascriptのコードは下記の通りです。

(function () {
	"use strict";

	kintone.events.on('app.record.detail.show', function (event) {
		
        var reuseButton = document.getElementsByClassName('gaia-argoui-app-menu-copy')[0];
        
        if(reuseButton){
            reuseButton.style.display="none";
        }
        return event;
	});

})();

(function () {

"use strict";

kintone.events.on('app.record.detail.show', function (event) {

var reuseButton = document.getElementsByClassName('gaia-argoui-app-menu-copy')[0];

if(reuseButton){

reuseButton.style.display="none";

}

return event;

});

})();

レコードの詳細画面を開いたときの処理になります。

「document.getElementsByClassName」でクラス名「gaia-argoui-app-menu-copy」の再利用ボタンのオブジェクトを読み取り、その後の処理で「style.display=”none”」とする事で非表示にしています。

オブジェクトの調べ方

クラス名の「gaia-argoui-app-menu-copy」ですが、Chromeで簡単に調べる事が可能です。
Chromeで再利用ボタンを右クリック→「検証」をクリック
reuse_kensyo1

右にソースコードが表示され、色が変わっている所がクリックした箇所のコードです。
reuse_kensyo2

この中の赤線の部分がjavascriptで指定するクラス名になります。

よく見ると一個上がレコード編集ボタンのコードになっていますが、例えばクラス名を
この編集ボタンの所に記載のある「gaia-argoui-app-menu-edit」に変えると、レコード編集ボタンが消える、といった処理も可能です。

注意：DOM操作はkintoneでは非推奨

最後に注意ですが、DOM操作はkintoneでは非推奨であり、裏技的な操作になります。
理由はkintoneは毎月アップデートがありますが、その際に仕様変更でクラス名など変わる事があり、動作しなくなる可能性があります。

kintoneの場合、一部のjavascriptが動作しなくなると他のスクリプトも動かなくなる可能性があるのでDOM操作は自己責任でお願いします。

その2：再利用ボタンが押されたら、強制的に戻す

公式で非推奨な処理は避けたい、という方は次の方法を推奨します。

再利用ボタンが押されたら、エラーメッセージを出して前の画面に戻すという処理になります。
実際の動きは以下の通りです。

reuse2

一度再利用ボタンを押すワンステップはありますが、この方法であればkintoneのアップデートの影響は受けずに処理を実装できます。

javascriptのコード

(function() {
    'use strict';

    kintone.events.on('app.record.create.show', function(event) {

	// アプリID取得
	var appId = event.appId;

        if (event.reuse) {
                alert('レコードの再利用ボタンが押されました。一覧画面に戻ります');
                location.href = "https://{ドメイン名}.cybozu.com/k/" + appId;
        }
    });
    
})();

(function() {

'use strict';

kintone.events.on('app.record.create.show', function(event) {

// アプリID取得

var appId = event.appId;

if (event.reuse) {

alert('レコードの再利用ボタンが押されました。一覧画面に戻ります');

location.href = "https://{ドメイン名}.cybozu.com/k/" + appId;

}

});

})();

※URLのドメイン名の箇所は各々の環境に合わせて変更してください。

eventオブジェクトの「event.reuse」がTrueの場合、再利用ボタンが押されたという判定になります。
その後、メッセージを出した後に「location.href」で一覧画面のURLを参照させています。

一覧画面に戻しているのは、レコードIDを指定して前の詳細画面に戻すのが面倒な為です。
(前画面のレコードIDを記憶しておかないといけないので、結構大変)

まとめ

再利用ボタンを制御する方法として２つの方法を紹介しました。

・　再利用ボタンそのものを消す方法
・　再利用ボタンを押されたら、強制的に一覧画面に戻す方法

特にkintone初心者は編集ボタンと再利用ボタンを間違えやすい傾向になるので、これで少しでもヒューマンエラーを減らしていきましょう。

ベストなのはkintone上で再利用ボタンの利用権限が設定できる事なんですが・・・サイボウズの今後のアップデートに期待しましょう。

前の記事

【kintone TIPS】ラジオボタンの選択により組織選択フィールドに部署名を格納する 2019.08.21
次の記事

【kintone TIPS】カテゴリーを必須入力・2個以上選択できないようにする方法 2019.08.29

【kintone TIPS】レコードの再利用ボタンを使用できないようにする２つの方法

厄介なレコード再利用ボタン

その1：再利用ボタンを画面から消す

javascriptのコード

オブジェクトの調べ方

注意：DOM操作はkintoneでは非推奨

その2：再利用ボタンが押されたら、強制的に戻す

javascriptのコード

まとめ

【kintone TIPS】ラジオボタンの選択により組織選択フィールドに部署名を格納する 2019.08.21

【kintone TIPS】カテゴリーを必須入力・2個以上選択できないようにする方法 2019.08.29