Hierarchical information: decomposing information into level

Ask the community
, ,
1

Hi,
I need to create a page that shows multiple records from a specific collection that is the result of the denormalization of other tables, so a lot of information is repeated (I did this because I did not find a mechanism to do joins between collections in wix code).

1586×964 96.7 KB

What I intend is to show the information in an indented form; this is,

  1. Contract as the main heading;
  2. Design as sub header;
  3. Action as a sub level
  4. Activity as detail

In other words, the page (scrollable) must present: The. All activities of certain action B. For each action present its goal w. All the actions of a project and all the projects of a contract. I need to show only the information and groupers (contract, project, action and activity) when there is a change in the respective information. Break by contract, project, action, activity.

I have created a page with the desired fields, but several records are not displayed (only 1 at a time). How do I do to:
A. Show multiple items (I already did a version with tables and I was not successful because the information repeats)?
B. How do I create levels of information and indents?

Thank you

693×397 19.7 KB

2

Hi! At this point it’s impossible to achieve what you want without coding.

With coding you can:

  1. Get information from collection with WixData module
  2. generate for instance, “.html” property for HTML component with all headers, sub headers and identation (with loops)
    It’s not easy but i think possible
3

Hi,

Could you please send me a example?

4

Hi Cesar,

  1. Example of how to get information from collection with WixData module

wixData.query("yourCollection")
.find() 
.then( (results) => {  
    console.log(results.items); // Array of all items in the collection
} );
  1. Example of how to use forEach on Array
	wixData.query("members")
		.find()
		.then((results) => {
			console.log(results.items); // Array of all items in the collection
			results.items.forEach(function (item, index) {
				$w(`#text${index}`).html = `${item.Fieldkey}`; // item represent an item from your database collection
				})
			});

Check out this reference:

Good luck!

5

Thanks, but how can I print / show the information of each level of the loopings? Is it possible to handle DOM elements directly? Writing into text variable and use iframe to show the content is a acceptable / good solution?

6

Hello Cesar,

Since your original question we released a reference fields feature that allows you to join collections.
You can find a tutorial here

7

Great,

Thank you