導入：kintoneにダイアログ表示の入力欄を追加！
kintoneで業務アプリを運用していると「ポップアップ入力の仕組みが欲しい！」と思うことありませんか？
今回は、2025年10月12日のkintoneアップデートで新しく実装された、kintone.createDialog()関数を使った「カスタムダイアログ」の作成機能をご紹介します。これを活用すれば、あなたのkintoneアプリにカスタム仕様のダイアログを装備し、入力忘れを防止するポップアップ機能が付いた業務ツールに進化します。
例えば、「重要なメッセージを表示して、必要な情報を確実に入力させたい」といった要望に対して、下記の様に、画面中央にポップアップでダイアログを表示して必要な入力をガイドしてくれる仕組みです。
デモ画面
以下の画面は、レコード編集画面で「任意の画像」と「テキスト」、「次回期日」の入力欄をポップアップ表示して、kintoneのフィールドに上書きセットしています。次回期日は、Datepickerでカレンダーから選択して日付を入力できるようにしています。
ダイアログのポップアップ条件を、レコードの次回期日が本日より過去の場合と設定しておけば、期日の経過したタスクの次回期日の入力を促すことができます。
（１）カスタムダイアログの目的
カスタムダイアログの最大の目的は、「アプリの使いやすさ（UX/UI）」を向上させることにあります。
| 項 目 | 従来のダイアログ（テキストのみ） | カスタムダイアログ（新機能） |
| 表示内容 | 文字列のみ（改行程度） | 画像、入力フォーム、ボタンなど自由なHTML要素 |
| 主な目的 | 「はい」か「いいえ」の操作確認 | ユーザーへの操作ガイドと情報入力の支援 |
新機能を使えば、従来の「確認メッセージ」しか出せなかったダイアログの枠を超えて、まるで小さな専用画面をアプリの中に埋め込むようにカスタマイズが可能です。
（２）メリット：劇的に使いやすくなる3つのポイント
カスタムダイアログ導入によって、業務にどのような変化が生まれるか、具体的なメリットをご紹介します。
メリット１：アプリの操作性が格段に向上する
ポップアップするダイアログ内に画像やテキストボックス、ボタンなどを自由に配置できるため、業務の流れに合わせた独自の操作画面が作れます。例えば「次回の期日を入力する」「入力すべき項目のヒントを出す」といった操作を、現在の画面を離れずに行えます。
メリット２：入力漏れ・ミスを未然に防げる
重要な情報を登録・更新する前に、カスタムダイアログに「必須の確認事項」や「根拠となる値」等を表示し、その場で必要な追記を促すことができます。これにより、「登録した後でミスに気づく」といったトラブルを大幅に減らせます。
メリット３：見た目が分かりやすく、愛着が湧く
単なるテキストだけの味気ない画面ではなく、レイアウトやデザインを調整できるため、業務アプリでありながら、まるで専用ソフトのような、分かりやすく洗練された画面デザインを実現できます。
（３）活用例：あなたの業務はこう変わる！
カスタムポップアップは、普段の業務の様々な場面で活用できます。
| 活用例 | 概要 | 改善されるポイント |
| 期限超過時の再設定 | 設定した期日を過ぎたレコード（例：タスク管理）を開いた時に、注意メッセージと新しい期日の入力ができるポップアップを表示し、期日を再設定させる。 | タスクの「放置」を防止し、優先度を再認識させる。手動での期日変更漏れを防ぐ。 |
| プロセス分岐時の確認 | プロセス管理のステータスを「承認」から「否認」に変更する際、否認理由を必須入力させるとともに、次工程担当者への通知設定をポップアップ内で確認・編集させる。 | プロセスの透明性を確保。手戻り時の情報連携ミスを防ぐ。 |
| 日報・活動報告の強制入力 | 営業日報アプリで、レコードの登録ボタンを押した際に、「訪問先の課題」や「次のアクション」の入力有無をチェックし、不足していればその場で入力させるポップアップを表示する。 | 報告内容の品質を標準化。入力漏れによるデータの不完全な状態を防ぐ。 |
| 勤怠打刻時の確認 | 勤怠管理アプリで「退勤」ボタンを押した際、「休憩時間は適切でしたか？」というメッセージと共に、その日の残業申請が必要かどうかのチェックボックスをポップアップ内に表示する。 | 打刻と同時に必要な手続きを促し、申請漏れ・不正打刻を防ぐ。 |
| 重要情報の再確認と追記 | 顧客情報や契約情報を削除する際、「本当に〇〇株式会社の情報を削除しますか？」という確認と同時に「削除理由」を入力させるポップアップを表示し、ログを完璧に残す。 | 誤操作の防止、監査証跡（誰が・いつ・なぜ削除したか）の確保。 |
| クイックなステータス変更 | レコードのステータスを「承認待ち」から「差し戻し」に変更するボタンを押した際、「差し戻し理由」や「再提出期限」をその場で入力させるポップアップを表示する。 | 手戻りを減らし、次のアクションに必要な情報を確実に取得。 |
| 操作マニュアルの表示 | 特定のフィールドに入力する前に、操作方法の簡単な図解画像やチェックリストをポップアップで表示し、迷わず入力できるようにナビゲートする。 | 新しい担当者でも迷わず入力できるようになり、教育コストを削減。 |
（４）技術的な注意点
このカスタムダイアログ機能は、kintoneの標準機能ではなく、JavaScriptというプログラム言語を使った「カスタマイズ機能」によって実現します。活用する上で、特に注意すべき点を理解しておきましょう。
注意点１：セキュリティ（入力値の無害化：HTMLエスケープ）
ダイアログ内にユーザーがテキストを入力できる欄を設ける場合、「HTMLエスケープ」という処理が非常に重要になります。これは、ユーザーが悪意のあるコードを入力し、それが実行されてしまうセキュリティリスクを防ぐための対策です。
この処理を怠ると、情報漏洩やアプリの破壊につながる恐れがあるため、ネット上のサンプルコードをそのまま利用するのは避けて、必ずセキュリティ対策に詳しい専門家に相談してください。
注意点２：プログラミングの難易度
この新機能は、従来の簡単なメッセージ表示機能と異なり、JavaScriptの知識の中でもやや高度な理解が求められる「Promise（プロミス）チェーン」という仕組みを理解している必要があります。
カスタマイズ経験が浅い方は、信頼できる外部のベンダーや開発パートナーに相談し、安全で確実なカスタマイズを実現することを強くお勧めします。
🎯 まとめ
中小企業の業務改善では、「正確な記録」を行える作業環境の構築がその第一歩です。
このカスタマイズにより、以下が実現できます。
✓ 重要な情報の入力漏れの回避
✓ データの正確性向上（入力漏れやミスの削減）
✓ 次の行動への注意喚起（ポップアップ表示）
✓ 継続的な改善活動の基盤構築（コレが最大のメリットです！）
カスタムなダイアログの表示を組み合わせるだけで、アプリの操作性が劇的に改善されます。
本カスタマイズ機能で、現場のDX（デジタルトランスフォーメーション）を推進してはいかがでしょうか。
kintone.createDialog()は「メッセージを表示するAPI」から「UIを組み立てるためのAPI」へと、大きく進化しています。
出来ることが多い分、学習コストも高めですが、Promise構造やDOMツリーの操作方法を学習済みならば、kintoneアプリ内に完全カスタムUIを構築できる強力な関数です。
🔨 自分でカスタマイズしてみたい方へ
以下のNote記事で本記事のカスタマイズ事例を紹介しています。
記事内で紹介しているカスタマイズコードは、無料で利用できるので是非挑戦してみて下さい。
「note:アプリ活用研究会（キン活）」は、当サイトのメンバーが執筆しています。
🌸 アプリテンプレートの販売
この記事で紹介したカスタマイズ機能のアプリテンプレートをサポート契約先限定でご提供しています。
アプリテンプレートを利用すれば、デモ画面の様に動くアプリを簡単に導入できます。
設定方法や操作方法もサポート対象です。
以下のファイル（パスワード保護付き）は、サポート契約先への配布用です。
サポート契約先以外のダウンロードやお問い合わせは、ご遠慮ください
サポート契約の料金体系
| 簡易サポート | 会員サポート | |
|---|---|---|
| 料金 | 税抜（1,000円×ユーザー数）／月 | 税抜（5,000円×ユーザー数）／月 |
| サービス内容 | プラグインとテンプレートの利用 | kintone運用の伴走支援 |
| プラグインと テンプレートのご利用 | ５種類まで | 無制限 |
🏫 kintone人材育成研修
この様なカスタマイズを自分で出来る様になりたい方は、当サイトの「Kintome人材育成」上級コースの受講をご検討して下さい。当サイトのTIPSで紹介しているカスタマイズ例のテンプレートを使えば、簡単に実装出来ます！
上級コースの受講者には、特典で当サイトのカスタマイズテンプレート（3種類まで）と３か月のサポート契約を無償でご提供しています。
研修目的を「カスタマイズテンプレートのアプリ導入」とする研修メニューもご提案可能です。
📣カスタマイズ・導入支援いたします！
本記事の様な「kintoneアプリのカスタマイズ」をご希望の企業様へ
kintoneを便利に活用できるカスタマイズと運用支援は、ぜひ当社にご相談ください！
#kintone #Javascript #カスタマイズ #ダイアログ作成
