キンコミ kintone user community

みんなの投稿

2021/09/03 11:06

初めまして!
以下の内容の実装で困っております。
どなたかアイデアなど頂けましたら幸いです。

【達成したいこと】
・タイムピッカーの単位を30分区切りから1時間区切りで選択できるように変更したい

【要件】
・外部プラグインは使用しない
・JavaScript または CSSのみのカスタマイズで解決したい

【課題】
・デフォルトの30分区切りから変更する方法が外部プラグインを使用する以外に発見できない

【ご質問】
・上記の要件を満たして課題の解決は可能でしょうか?
・具体的な方法がございましたらご教示頂けますと幸いです。

以上よろしくお願いいたします。

2件のコメント (新着順)
koichi
開発
2021/09/04 21:49

U.Dさん
こんにちは。

developer networkの方と同じ方ですね。
同じ内容になりますが、こちらにも回答させていただきます。



時間の選択値から30分単位のものを無理やり削除するもので良ければ、以下の形でできました。
時刻部分がクリックされると、選択値の要素「goog-menuitem」が生成されます。
それをMutationObserverで監視し、生成されたら各選択値(要素)をfor文でチェックし、30分単位であれば要素ごと削除します。



レコード追加時の例ですので、レコード編集時でしたらapp.record.edit.showに記載してみてください。
※すべての日時・時刻フィールドに対して適用されます。

(function() {

    'use strict';

    var events = ['app.record.create.show'];
    kintone.events.on(events, function(event) {

        const target = document.body;
        // ノードに変化があれば実行
        const observer = new MutationObserver(function() {

            // 時刻選択要素を取得
            var el = document.getElementsByClassName('goog-menuitem');
            for (var i = 0; i < el.length; i++) {
                // 30分単位は要素を削除
                if (el[i].textContent.slice(-2) == '30') {
                    el[i].parentNode.removeChild(el[i]);
                }
            }

        });
        const config = { childList: true, subtree: true };  // 監視を指定するオプション
        observer.observe(target, config);       // 監視開始

    });

})();

koichi
開発
2021/09/04 22:01

U.Dさん

差し支えなければで構いませんので、投稿文にある「外部プラグイン」を紹介いただけないでしょうか。
私含め、プラグイン使ってみたいという方がコミュニティ内にいらっしゃるかもしれませんので、よろしくお願いします。

htnk
2021/09/03 17:03

U.D さん、こんにちは!
キンコミ運営事務局の htnk と申します。
この度はアイデア募集アプリに投稿をいただき、ありがとうございます。

投稿いただいた内容に関して一点お伝えしたくコメントさせていただきました。
キンコミは、正解のない情報をみんなで共有するコミュニティです。
今回の「タイムピッカーの単位を30分区切りから1時間区切りで選択できるように変更したい」について
それが必要な理由、どういった状況で利用するのか、など背景や状況をお伝えいただくことによって
今回 U.D さんが解決したい方法とは異なるかもしれませんが、皆さんの豊富なアイデアが得られるかもしれません。
その際に、今まで調べたこと・試したことなども併せてご記入いただけると、皆さんの理解にいっそう役立つかと思います。
キンコミのガイドラインにも記載しておりますので、よければご覧ください。
https://kincom.cybozu.co.jp/guideline

引き続き、キンコミでの皆さんとの情報共有をお楽しみいただければ幸いです。