アプリ活用研究会

中小企業の業務デジタル化を、無料又は低価格のアプリ活用で実現した事例を情報発信していま…

アプリ活用研究会

中小企業の業務デジタル化を、無料又は低価格のアプリ活用で実現した事例を情報発信しています。 基本方針は、専門的な説明をできるだけ省いて、中小企業経営者の目線で情報発信することです。 市販アプリ活用、ノーコードツール活用、その具体的な方法等を紹介して行きます。

  • Kinote UI Componentのカスタマイズ事例

    Kinote UI Component（略称：KUC）を利用したアプリのカスタマイズ事例の記事を掲載したマガジンです。 KUCは、kintone カスタマイズでの UI 開発などで「kintone のフォームのパーツを自作する」ためのライブラリです。 JavascriptコードでKintoneライクなフォームのパーツを自作できます。

  • Kintoneで関連レコードと合計を表示するテーブルの実装

    アプリにテーブル形式で関連レコードの明細表示と金額フィールドの合計を表示します。テーブル形式の表示パーツにkintone UI Component v1の部品ReadOnlyTable利用して、Kintoneライクな外見で表示します。 標準機能の関連レコードでは出来ない、合計表示や列の表示／非表示の切り替え等の機能を実装する手順を全5回の連載で公開しています。

  • 固定された記事

Kintoneアプリにボタン操作で現在日時を記録したい

Kintoneのカスタマイズ要望のお話です。 よくある相談事に「アプリの日時フィールドに現在日時を自動セットするボタンを追加したい」という要望があります。 【結論】 Kintoneの標準機能では実現できません。 Kintoneの標準機能には、Excelで使える「Today関数」や「Now関数」が実装されて無いからです（2023/09/09 現在） しかし、Javascriptによるカスタマイズ機能で「実現可能」です。 Javascriptカスタマイズのソースコード例を以下に

3,000
アプリ活用研究会

    • 別アプリ参照で３階層動的絞り込みドロップダウン

      やりたいこと kintoneで別アプリのレコードを参照したドロップダウンリストで、大分類と小分類を選択して、分類項目に一致するアイテムだけを絞り込み選択できる3階層動的絞り込みドロップダウンリストを実装したい。 この様な要望を頂きましたので、kintone UI Component v1のDropdownを利用して作成してみました。 デモ画面１ デモ画面では、別アプリ（商品メニュー）のレコード値の大分類、小分類、商品名の値を外部参照してをドロップダウンリストの値にしてい

      アプリ活用研究会

      • Excelで３階層で絞り込み表示するプルダウンを作成

        やりたいこと エクセルのプルダウン入力を大分類＞小分類＞商品名の３層で絞り込み表示して入力できるようにしたい。 大分類の選択で小分類を絞り込み表示して、大分類と小分類の選択で、商品名を絞り込み表示するプルダウンを実装します。 ※Excel2021とMicrosoft365バージョンで動作確認しています。 ※Excel2019以前のバージョンではFILTER関数が使えないので動作しません。 デモ画面 デモ画面は、大分類、小分類、商品名のある商品マスタ（カフェメニュー）を準

        アプリ活用研究会

        • テーブルの邪魔な列を非表示にする

          やりたいこと kintoneの経費精算アプリで、科目別の集計行を計算フィールドで作成してますが、新規レコード登録と編集画面では、テーブルが横長になり過ぎて操作しづらいので、科目別の計算フィールドを非表示にしたい。 kintoneではsumif関数が使えないので、代替手段としてkintoneヘルプページの「kintoneにSUMIF関数はありますか？」で紹介されているアプリ作成例とJavascriptカスタマイズの合わせ技です。 テーブルの科目別の金額を集計するために、３

          アプリ活用研究会
        • 固定された記事

        Kintoneアプリにボタン操作で現在日時を記録したい

        アプリ活用研究会

        マガジン

        • Kinote UI Componentのカスタマイズ事例
          16本
        • Kintoneで関連レコードと合計を表示するテーブルの実装
          6本

        記事

          アプリのテーブルに入力補助機能を付加する

          やりたいこと Kintoneアプリのテーブル中のフィールドに入力補助機能を付けたい。 具体的には、テーブルの各項目にプレイスホルダー（代用文字）やツールチップ（吹き出し型のヒント）を実装したい。 標準機能のテーブルでは、この様なカスタマイズは出来ませんので、本稿では、kintone UI Component v1のTableを利用してカスタマイズ版のテーブル（ＫＵＣ版テーブルと呼びます）を作成する事例を紹介します。 ＫＵＣ版テーブルの役割はテーブル枠機能だけなので、他のコ

          アプリ活用研究会

          アプリのテーブルに入力補助機能を付加する

          アプリ活用研究会

          文字列複数行フィールドに入力支援機能を追加する

          やりたいこと Kintoneアプリの文字列複数行フィールドに、入力でユーザーが迷わない様に入力例を表示する「placeholder（代用文字）」を実装したい。 「placeholder」とは、入力フィールド空欄時に「入力例」として表示される半透明のテキストのことです。 表示されているだけで入力値にならないテキストです。 標準機能では文字列（複数行）フィールドに「placeholder」を付ける機能は無いので本稿では、kintone UI Component v1のTex

          アプリ活用研究会

          文字列複数行フィールドに入力支援機能を追加する

          アプリ活用研究会

          文字列1行フィールドに入力支援機能を追加する。

          やりたいこと Kintoneのアプリは、直感的に使えるＵＩ（ユーザーインターフェイス）を備えていますが、それでも入力方法に迷うユーザーの為に入力支援機能を画面上で表示できると良いですね。 例えば、Kintoneアプリの文字列１行フィールドに、入力でユーザーが迷わない様に入力支援機能（代用文字、ツールチップなど）を追加します。 今回は「placeholder（代用文字）」の実装方法を紹介します。 「placeholder」とは、入力フィールド空欄時に「入力例」として表示され

          アプリ活用研究会

          文字列1行フィールドに入力支援機能を追加する。

          アプリ活用研究会

          関連レコードと合計を表示するテーブルの実装（５／５）

          やりたいこと アプリにテーブル形式で関連レコードの明細表示と金額フィールドの合計を表示します。テーブル形式の表示パーツにkintone UI Component v1の部品ReadOnlyTable利用して、Kintoneライクな外見で表示します。 ※本記事では「KUC版読取り専用テーブル」と呼びます。 ※サンプルとしてKintoneアプリストアの「営業支援パック」を使用します。 今回のカスタマイズは、全体で120行を超える大きなコードになりますので、手順を分割して全部

          アプリ活用研究会

          関連レコードと合計を表示するテーブルの実装（５／５）

          アプリ活用研究会

          アプリに操作ガイドのツールチップを実装する

          やりたいこと Kintoneアプリの操作でユーザーが迷わない様に、操作方法のガイド等を表示する「ツールチップ」を実装したい。 標準機能ではアプリのフォームに「ツールチップ」を付ける機能は無いので kintone UI Component v1のコンポーネントTooltipを利用して実装します。 「ツールチップ」とは、kintoneの基本操作のアイコンにも表示される吹き出し型のヒント文字のことです。 デモ画面 デモ画面では、タイトル文字の入力方法をツールチップで表示して

          アプリ活用研究会

          アプリに操作ガイドのツールチップを実装する

          アプリ活用研究会

          関連レコードと合計を表示するテーブルの実装（４／５）

          やりたいこと アプリにテーブル形式で関連レコードの明細表示と金額フィールドの合計を表示します。テーブル形式の表示パーツにkintone UI Component v1の部品ReadOnlyTable利用して、Kintoneライクな外見で表示します。 ※本記事では「KUC版読取り専用テーブル」と呼びます。 ※サンプルとしてKintoneアプリストアの「営業支援パック」を使用します。 今回のカスタマイズは、全体で120行を超える大きなコードになりますので、手順を分割して全部

          アプリ活用研究会

          関連レコードと合計を表示するテーブルの実装（４／５）

          アプリ活用研究会

          kintone UI Componentの実装（本番環境への導入方法と注意点）

          kintone UI Componentとは kintone UI Component（以降「KUC」と略す場合もあります）は、kintone カスタマイズでの UI 開発などで「kintone のフォームのパーツを自作する」ためのライブラリです。 JavascriptコードでKintoneライクなフォームのパーツを自作できます。 通常、Kintoneのフィールドの設定値（例：ラジオボタンの選択肢等）は、Javascriptで変更することはできません。 しかし、kinto

          アプリ活用研究会

          kintone UI Componentの実装（本番環境への導入方法と注意点）

          アプリ活用研究会

          関連レコードと合計を表示するテーブルの実装（３／５）

          やりたいこと アプリにテーブル形式で関連レコードの明細表示と金額フィールドの合計を表示します。テーブル形式の表示パーツにkintone UI Component v1の部品ReadOnlyTableを利用して、Kintoneライクな外見で表示します。 ※本記事では「KUC版読取り専用テーブル」と呼びます。 ※サンプルとしてKintoneアプリストアの「営業支援パック」を使用します。 今回のカスタマイズは、全体で120行を超える大きなコードになりますので、手順を分割して全

          アプリ活用研究会

          関連レコードと合計を表示するテーブルの実装（３／５）

          アプリ活用研究会

          関連レコードと合計を表示するテーブルの実装（２／５）

          やりたいこと アプリにテーブル形式で関連レコードの明細表示と金額フィールドの合計を表示します。テーブル形式の表示パーツにkintone UI Component v1の部品ReadOnlyTableを利用して、Kintoneライクな外見で表示します。 ※本記事では「KUC版読取り専用テーブル」と呼びます。 ※サンプルとしてKintoneアプリストアの「営業支援パック」を使用します。 今回のカスタマイズは、全体で120行を超える大きなコードになりますので、手順を分割して全

          アプリ活用研究会

          関連レコードと合計を表示するテーブルの実装（２／５）

          アプリ活用研究会

          関連レコードと合計を表示するテーブルの実装（１／５）

          やりたいこと アプリにテーブル形式で関連レコードの明細表示と金額フィールドの合計を表示します。テーブル形式の表示パーツにkintone UI Component v1の部品ReadOnlyTable利用してKintoneライクな外見で表示します。 この方法の良い点は、アプリのフォーム上に表形式でデータ表示する処理をHTMLの＜TABLE＞タグで記述する面倒な手間が無いことです。 kintone UI Component v1コンポーネントReadOnlyTableのプロパ

          アプリ活用研究会

          関連レコードと合計を表示するテーブルの実装（１／５）

          アプリ活用研究会

          日時フィールドの時刻開始～終了範囲の変更＆15分間隔で時刻選択を可能にする

          やりたいこと kintone標準機能の日時フィールドは日付と時刻の入力支援ツール（Picker）が使える入力部品ですが、時刻部分の入力範囲が00:00～23:59のフルタイムで時刻選択も30分間隔であり、この設定を変更することはできません。 参照：Kintoneヘルプ／日時 しかし、時刻部分の表示範囲を会社の営業時間内に制限したり、時刻選択の間隔をもっと細かくしたいという現場ニーズはあると思います。 kintone UI Component v1を利用すれば、日時フィール

          1,000
          アプリ活用研究会

          日時フィールドの時刻開始～終了範囲の変更＆15分間隔で時…

          アプリ活用研究会

          時刻フィールドの開始～終了範囲の変更＆15分間隔で時刻選択を可能にする

          やりたいこと kintone標準機能の時刻フィールドは入力範囲が00:00～23:59のフルタイムで時刻選択も30分間隔であり、この設定を変更することはできません。 参照：Kintoneヘルプ／時刻 しかし、時刻の表示範囲を会社の営業時間内に制限したり、時刻選択の間隔をもっと細かくしたいという現場ニーズはあると思います。 kintone UI Component v1を利用すれば、時刻の開始～終了範囲を変更したり、時刻選択の間隔を自由指定できる時刻フィールドを作成できます。

          アプリ活用研究会

          時刻フィールドの開始～終了範囲の変更＆15分間隔で時刻選択を可能にする

          アプリ活用研究会