• IT助成金利用
  • 無料デモ紹介ZOOM等オンラインでのご相談も可能です
  • お問い合わせ

※ ワンダーロボ設計書および関連する自動開発手法について、すべての著作権はワンダフルフライ株式会社に帰属します。

検索結果をリスト表示!グリッドの便利機能まとめ

グリッド表示で見やすく管理、スムーズ操作!

このページには、グリッド表、スマート検索機能、検索ボタンが入っていて、スマート検索で条件に応じた素早い検索ができちゃいます!

📝 こんな時に使えます!

日常的なデータ管理で、このページはユーザーがサクサク情報を検索・管理するのに役立ちます。grid 表でデータを分かりやすく表示(例えば名前、分類、部署など)、さらに以下の操作が簡単にできます:

  • 1.スマート検索を使って複数条件での検索がスムーズに可能!
  • 2.グリッド表で結果を一覧表示。ページ送りや並び替えも楽々。
  • 3.行の追加や削除も簡単操作でOK!
  • 4.ページ移動や行の操作時に自動で処理が実行され、データの一貫性もバッチリ確保。

📝 構成

  • 1.スマート検索機能:

    ページ上部に検索条件を入力して、条件に基づいた検索を実行!

  • 2.グリッド表:

    検索に合致したデータが一覧で表示されるエリア。自動データロード、ページ送り、並び替え、行追加・削除も簡単。

  • 3.検索ボタン:

    検索ボタンをクリックすると、ページ上で入力した条件に基づいて、カスタマイズされた関数処理で検索が実行されます。この機能によって、ユーザーは特定のデータを簡単に抽出できるようになります。条件設定をすることで、探したい情報だけを絞り込んで表示できます。

⚙️ 設計の仕方

➣設定例:

1.グリッド設定

  • ①表示範囲:

    グリッド表は、セル範囲「C7~J9」に表示されます。この範囲内に、条件に合ったデータが並びます。

  • ②タイトル範囲:

    「C7~J7」セルには、Gridの各列タイトルが表示されます。例として「ユーザーID」「社員名」の項目がタイトルとなります。

  • ③グリッドタイプ:

    表示形式は「グリッド型」で、1行目に各列のタイトルが並びます。これは、データを簡単に識別しやすくするためです。

  • ④高さ自動設定:

    各行の高さは、内容に応じて自動的に調整されます。データ量が多ければ、高さが自動的に伸びます。

  • ⑤表示幅:

    Grid表の全体の高さは「200」に設定すると、この設定により、Grid表が占める高さが一定になります。

  • ⑥表示モード:

    Grid表は「表示のみ」のモードで、ユーザーが直接編集することはできません。編集はできませんが、情報は見ることができます。

  • ⑦最大行数:

    表示される最大行数は「20行」に設定すると、20行を超えるデータは自動的にページが分割されます。

  • ⑧修正不可列:

    特定の列(例:C3、D3列)は、読み取り専用として設定されており、これらの列は編集できません。

  • ⑨初期ソート順:

    Grid表が表示された際に、例えばC3列は昇順(小さい順)、D3列は降順(大きい順)で自動的にソートされます。

  • ⑩行操作:

    Grid表では、行の追加や削除が自動的に行えます。これらの操作に特別なボタンは不要です。

  • ⑪自動クエリ:

    Grid表のデータは、ページロード時に自動でクエリを実行して最新のデータを表示させたい場合は「実行」を指定します。逆に、表示させたくない場合は「しない」を指定します。

この設定により、Grid表は整理された状態でデータを表示し、操作性が向上します。ユーザーは、データの編集を行うことなく、必要な情報を視覚的に確認し、必要な操作(追加、削除など)を直感的に行えます。また、データは自動で更新され、ページ分割機能で多くのデータにも対応できます。

※注意点として、①②③⑪は必須設定です。それ以外は設定してもしなくても構いません。

 

2.スマート検索設定

  • ①検索条件:

    画面設計でスマート検索機能に対応した検索条件を設定します。例:「社員ID、氏名」

  • ②検索ボタン:

    画面設計でセルの値には「検索」を設定します。例:セル「K3」

  • ③グリッドと関連づけ:

    グリッド範囲の先頭セル名を指定します。例:「C7」と関連づけ

  • ④条件説明:
     
    「1」社員ID中間一致ユーザーID:

      ユーザーが「社員ID」に特定のキーワードを入力すると、入力されたキーワードを社員ID内で中間一致検索します。例えば、ユーザーが「123」と入力した場合、社員IDが「1234」や「5123」など、含まれているすべての社員が検索されます。

     
    「2」氏名中間一致社員名:

        ユーザーが「氏名」に入力した文字列が社員名の中間に一致する場合、その社員が検索結果に表示されます。例えば、「田中」と入力すると、「田中太郎」や「田村一郎」など、名前に「田中」を含むす
      べての社員が検索されます。

➣結果:

🔍 まとめ

これにより、データを効率よく管理するためにグリッド表示とスマート検索機能を組み合わせています。ユーザーは簡単に条件を設定してデータを検索・表示でき、表示された情報は編集できないものの、直感的に操作できます。特に、検索条件に応じてデータを迅速に絞り込めるため、日常的なデータ管理がスムーズになります。さらに、データが自動で更新され、ページ分割や並び替えなどの操作も簡単に行える点が大きな特徴です。