リストの追加

[アーティクル]
02/13/2024

リストは、データ駆動型の構成で、開発者がポータルでグリッドを表示しなくても、レコードのリストをレンダリングするために使用します。リストは、Dataverse ビューを使用して、ポータルのレコードを表示します。

リストでは、Power Pages サイトのデータをグリッド表示します。ページ上のリストは、Dataverse のテーブルビューから作成されます。 Dataverse のテーブルビューは、データワークスペースを使用するか、Power Apps で作成したモデル駆動型アプリから作成することができます。ページやフォームと一緒に使うことで、完全なウェブアプリケーションを構築することができます。

チップ

Power Pages の使い方や、ビューの作成方法、ページへリストの追加方法などを学べるチュートリアルやビデオシリーズを作成しました。詳細については、チュートリアル: ページへのリストの追加を参照してください。

リストの追加方法:

デザインスタジオを開き、ページのコンテンツやコンポーネントを編集します。
編集するページを選択します。
リストコンポーネントを追加するセクションを選択します。
編集可能なキャンバスエリアにカーソルを合わせて、コンポーネントパネルから リスト アイコンを選択します。

リストの追加 ウィンドウが開きます。
新規リストを作成するか、既存リストを選択するかを選択し、OK を選択します。

注意

リストの更新バージョンであるモダンリストは、Power Pages で使用できます。サイトでこのバージョンのリストを使用するには、トグルをオンに切り替えます。詳細: モダンリスト (プレビュー)
- 新しいリストの作成を選択した場合、リストの追加 ウィンドウが設定タブに開きます。
- 既存のリストを使用する場合は、ページワークスペースに表示されるリストにリダイレクトされます。リストを選択し、コンポーネントのすぐ上にある リストの編集 ボタンを選択して、リストの追加 ウィンドウの構成オプションにアクセスします。リストを編集するときに、リストをモダンリストに変更することも選択できます。

モダンリスト (プレビュー)

モダンリストは、Power Pages にある既存リストの更新バージョンで、視覚的な効果と拡張されたスタイルの機能を提供します。

Shimmer のローディング - データがデータソースから取得されている間、ローディングアニメーションが表示されます。
無限スクロール - ユーザーがスクロールすると、コンテンツはページの下部に自動的に読み込まれます。
インラインフィルター - フィルターはリストビューのすべての列に自動的に適用されます。
スタイルオプション - 背景やフォントの色などの要素をカスタマイズしたり、行の色を交互に追加したり、余白とパディングを調整します。

チップ

サイト内のあるモダンリストから他のモダンリストにスタイルをコピーして、ページ間で一貫したデザインエクスペリエンスを実現できます。

リストの設定

設定フィールドごとに値を指定する必要があります。 リストの追加 ウィンドウで設定メニュータブを選択して、この手順を完了します。

リスト	説明
テーブルを選択する	ビューの読み込み元となるテーブルの名前。
Dataverse ビューを選択する	レンダリングされるターゲットテーブルのビュー。ビュー内の列を変更するには、データワークスペースにアクセスする必要があります。
リストに名前を指定する	一覧の名前。

リストアクションの選択

リストアクションを構成して、リストに対して実行するアクションを指定します。アクションは、リストの追加 ウィンドウの アクション メニュータブの下に一覧表示されます。これらのオプションごとに、表示ラベル フィールドを編集してデフォルトのボタンラベルを変更することもできます。

日付	説明
新しいレコードを作成する	ユーザーが新しいレコードを作成できるようにします。新しいレコードが含まれる対象の Web ページ、フォーム、または URL を選択する必要があります。
ダウンロードリストのコンテンツ	ユーザーがリストの内容を *.xlsx ファイルにダウンロードできるようにします。
詳細を表示する	詳細を表示できるようにします。詳細が含まれる Web ページ、フォーム、または URL を選択する必要があります。
レコードの編集	ユーザーがレコードを編集できるようにします。編集するレコードの詳細が含まれる Web ページ、フォーム、または URL を選択する必要があります。
レコードの削除	ユーザーがレコードを削除できるようにします。

その他のオプションの指定

リストのオプションをさらにカスタマイズする場合があります。 リストの追加 ウィンドウから その他のオプション メニュータブにアクセスして、リストのその他のオプションを構成します。

設定	説明
ページあたりのレコード数	各ページに表示されるレコード数を指定します。テーブルにさらに多くのレコードが含まれている場合、ユーザーには、次または前のレコードセットを表示するためのナビゲーションコントロールが表示されます。
リストでの検索を有効にする	リストの検索機能をオンにします。検索バーにプレースホルダーテキストを追加します

注意

ユーザーがリストのデータを見ることができるようにするために、テーブルのアクセス許可を有効にする必要があります。

ポータル管理アプリを使用してオプションをさらに指定することもできます。

リストの複製

デザインスタジオ内のページワークスペースから、リストコンポーネント上にある省略記号 (...) を選択して、リストの複製、セクション内での上下移動、または削除を行うことができます。

リストフィルター

作成者は、デザインスタジオから Power Pages サイトにリストフィルターを追加できます。

フィルタータイプ

ポータル管理アプリでサポートされているすべてのタイプのメタデータフィルターは、Power Pages スタジオで設定可能で、各フィルターには、そのビジュアルに合った簡略化された名前が付けられています。また、デザインスタジオ内でリストコンポーネントを操作する際にも、フィルターの編集、削除が可能です。

フィルターの視覚化	説明
Text	テキストボックスを使用してリストにフィルター処理を行い、特定のテーブルの選択された属性で一致するテキストを検索します。
チェックボックス、ドロップダウン、ラジオボタン	作成者は、フィルタータイプの視覚化として、チェックボックス、ドロップダウン、ラジオボタンから選択できます。作成者が列を選択すると、フィルターを構成するためのその他のオプションが表示されます。これらのオプションは、列のデータの種類によって異なります。
Custom	FetchXML フィルター条件を使用して、リストにフィルター処理を行います。作成者がカスタムを選択すると、テキストボックスが表示されます。作成者はこのフィールドに XML ステートメントを入力します。

リストのフィルターを追加する

リストフィルターを追加するには、以前に追加して構成したリストコンポーネントを選択します。

ツールバーから フィルターの追加 メニュー項目を選択します。

ページワークスペースに、リストフィルターオプションのポップアップウィンドウが表示されます。
種類ラベルの下にあるドロップダウンセレクターから、使用するフィルタの種類を選択します。
列ラベルの下にあるドロップダウンセレクターから、使用する列を選択します。

注意

スタジオには、作成者が選択したフィルターの種類と列に基づいて、データをフィルターするためのさまざまなオプションが表示されます。
OK ボタン をクリックして、選択内容を保存します。
フィルターを適用すると、デザインスタジオのフィルターの編集ボタンを選択してフィルター構成を編集できます。