RepeatingGroup のレコードを別のページの RepeatingGroup に渡すには

Other languages 日本語 (Japanese)
1

あるページの RepeatingGroup に表示しているレコードの内容を、別のページの RepeatingGroup にそのままの状態（検索結果やソート順を維持して）で表示したい。

概要

商品のデータベースを作り、一覧表のページで検索やソートを行う。詳細ページに移行した際は、一覧表のページの検索結果やソート順を維持したまま、各商品の詳細情報を閲覧したい。

データ構成例

Type name：
product

Fields for type product：
name（text）
overview（text）
price（number）
note（text）

ページ構成例

list-page（RepeatingGroup で一覧表を表示）
detail-page（RepeatingGroup を Rows 1、Columns 1 にして詳細を表示）

各ページの Type of content は product を設定。
それぞれのページのヘッダーには、detail または list へ移行するボタンを配置する。

現状

RepeatingGroup の行をクリックして、そのレコードだけを表示することはできた。
例えば、Data to send で Current cell’s product を指定し、移行先のページの RepeatingGroup の Data source で Get path from page URL:converted to List を指定または、一覧から詳細への移行ボタンの Data to send で RepeatingGroup product’s List of product:first item などと指定し、移行先のページの RepeatingGroup の Data source で Get path from page URL:converted to List を指定するなど。

一つのレコードを渡すことはできたが、RepeatingGroup に表示している複数のレコードの内容を、別のページの RepeatingGroup にそのままの状態（検索結果やソート順を維持して）で渡すにはどのようにしたらよいだろうか。ヒントをいただければ幸いです。

2

@yasu さん、ようこそ。
そのRepeating Groupを「Reusable elementにコンバートして、それぞれのページで再利用する」ってのがあります。簡単なダミーレコードを作って、それをReusable elementにコンバートして実験してみてください。Groupもコンバートできます。

3

rio さん、ありがとうございます！
いろいろ試してみます。
取り急ぎ御礼まで。

4

結果報告です。
RepeatingGroup を Reusable elements にして試しました。

まず、各ページでの SearchBox 検索は、Reusable elements のカスタムイベントを Trigger して、Reusable elements 内の RepeatingGroup を検索することで何とかなりそうです。

list ページと card ページのレイアウトの切り替えは、Reusable elements 内の RepeatingGroup を list 用（複数行の一覧表）と card 用（Rows 1、Columns 1 の詳細表示）の2つを用意して、 conditional でページ名をもとに visible にする感じで何とかなりそうです。

ただ、list ページの SearchBox を使った検索結果を card ページでそのまま表示する方法が思いつきません。list で RepeatingGroup を検索した後、card ページに切り替えても同じレコードの構成（検索結果やソート状態）にしたいのですが、何かよい方法はないでしょうか？
結局、card に切り替えたときに、list と同じ検索やソートを実行しなければならないでしょうか？

5

別ページでデータの引き渡しをするにはGet path from page URLを使いますが、そのキーをRGに検索やソートで利用できていますか？RGのData sourceやfilter条件のスクリーンショットを見せてもらえますか？

あと今さらですが、listとcardは別ページでないといけない理由があるのでしょうか？というのも、実行結果をページ間で引き継ぐ手段は限られているからです。もしlistとcardを一つのページであれば、custom stateを使って容易に、現在の状態を保持したままviewの制御ができます。

6

rio さん、ありがとうございます。
的確なリプライに感謝します。

RG に検索やソートで渡しているデータは不十分な状態です。これは私の知識不足のためです。

今は、Data to send で検索結果の1レコードだけを渡して、そのデータを RG に表示できることを確認しています。RG の Data source や filter 条件の設定までは実現できていません。

list から card に切り替えるボタンの Workflow は以下のとおりです。

Go to page card
Distination: card
Data to send: Serach for product:first item
Serach for products
Type: product
name contains SearchBox 検索’s value’s name

card 用の RepeatingGroup は以下のとおりです。

Type of content：product
Data source：Get path from page URL:converted to list
Type：Path
Type：product

本当は検索結果の複数のレコードの情報を渡したいのですが、上記の処理で、検索結果の1レコードだけを渡せることを確認しています。

list と card を別ページに分ける理由は、ページ毎にデータの見せ方が違うためです。各ページ毎にデザインが異なるため、ページ毎に分離して作り込みたいと思ったからです。異なる用途のレイアウトを一つのページに重ねて（条件分け）作るのではなく、デザインや用途毎にページを分離し、データベースの内容は共有したいと考えました。

しかしながら、ページ間のデータ受け渡しが非効率なら、ご指摘のとおり list と card を一つのページで作ることも試してみます。いといろ勉強しながらやってみます。貴重なアドバイスをありがとうございます。

1 Like
7

@yasu さんのケースのようにlistからcardを呼び出すような場合、ページに分けてしまうと、そのページを行き来する度にページをリロードするためUXが落ちますね。その点、SPAにしてしまうと最初だけローディングに時間かかるのですが、その後はサクサク動いてくれます。通常のウェブサイトはページを細かく分けて作りますが、ウェブアプリの場合はネイティブアプリと同じようにSPAで運用した方が、データの受け渡し含めて都合がいいことが多いと、個人的には思ってます。

1 Like
8

@rio さん、ありがとうございます。
大変勉強になりました。そうですね。UX を優先しないと。
あと少し実験してから、SPA を基本として作り直してみます。

ありがとうございます！