Forum Documentation Showcase Pricing Learn more

Creating folders for individualized content - like a real estate app

Hi there,

I want to create a list, where a user can click on the a list name and each name will take them to a unique set of content. Like a real estate app where a user might have a list of addresses and when they click on one address they see details and photos of that address.

Thanks!

I dunno what you mean by “folders”, but in Bubble, we visualize arrays (“Lists” in Bubble-speak) using an element called a Repeating Group.

First: Do the tutorial lessons:

ALL OF THEM. NO CHEATING.

Then go here:

Happy Bubblin’!
-K-

3 Likes

Hi Keith,

Thanks for your reply.
I think you’ve misunderstood my question. I know how to make a list as such… what I’m after is the ability to click on each name of the list to take me to it’s own individual content.

I used the real estate example earlier…

So I might have a list of addresses of property on sale that I can click on. When I click on the first address I will then be taken to a page with completely different pictures and text to if I click on the second address etc.

I need to be able to set that link from the list to individualized content.
Am I making sense? Sorry I just don’t know the jargon.

Veronica

That is basic bubble 101.

As Keith said you need to go through the tutorials.
It is well explained there.

You need to go through the lessons of assigning a Type of thing to a page and passing the thing to that page.

2 Likes

Hi JonL,

I’ve been through the tutorial but I can’t find exactly what I’m looking for.

Let me make it exactly clear:

  1. My home page is a list eg. rent, buy, sold
  2. I need to be able to click on one of those above eg. I click on rent and then a page displaying all the addresses that are for rent opens
  3. I need to be able to click on one of those addresses where another page opens to show me details of that property plus photos.

If you’re talking about the “send data to pages” tutorial… its too basic for what I’m trying to do.
If you;re talking about a different tutorial… would you mind posting the link here? I just can’t seem to figure out which tutorial has taught me this already…

Thank you!

Sorry - just to add some detail…

Because I need the “rent” addresses and “buy” addresses and “sold” address all to be their own list. Without making a seperate page for each manually (because I want the flexibility to add more options in the future eg. “rent, buy, sold, home & land package”) I can’t seem to figure out how to do it.

If you want all of that on a single page, you could Pass the data in the URL parameter as type=rent or type=buy, etc based on what is clicked. And on Page load, use that URL parameter to filter the information you present to the user.

Of-course, this requires that all your information is of the same data type so that you can filter it accordingly on the single page.

2 Likes

I’m not sure I understand what makes this more complex. It feels pretty straight forward to me, what part specifically are you struggling with?

Watch my video and you’ll get it!

1 Like

I still can’t seem to transfer data from one page to another. I’ve made a list and when I click on “Item A” on the list I want to go to another page where the data is linked to the item selected.

I know your video shows how to transfer data within the same page but I suspect the codes are different when it’s to another page?

Thanks for bearing with me!

Well, if you need that selection to be persistent across a page change, you need to send that information to the next page.

Bubble has a default built-in facility for this (do the “sending data to pages” tutorial again, please).

In short, it works as follows: You have two pages Page A and Page B. On Page A, the user selects some thing in which they are interested. On Page B, you display information about that thing. Page B knows what information to display because (in Bubble speak), you “send data to the page.”

The page object on Page B has a data type associated with it. Select the data type of the thing you want to display.

Now go to Page A. In a workflow action (wherever it’s appropriate), Navigate > Go To Page. You’ll see place to enter “data to send”. Put the selected item there.

I think that’s where I’m experiencing the confusion… in data type. My list is going from one item on a repeating group to opening a new page with another repeating group both containing photos and text. It’s a little confusing, photo, text, user etc. And I keep experiencing errors because they’re not all matching… ugh!

Sorry - I know how novice I must sound…

Ok… How can I have both photos and text on the one page?

Without it confusing the page type

Your page type should be a thing, sich as “Listing.” The repeating group for images would have a data source of “current page Listing’s photos” (or whatever you named the photo field on the Listing).

If you shared the editor link to your app, I’m confident this would be cleared up for you in a handful of minutes.

1 Like

A text is not a Thing.

A Thing is a custom data type in your database. A page’s data type can only be a Thing, it cannot be a primitive. (e.g., a page cannot be of “text” type). But you can put any damn stuff on your page that you want.

If you need to pass a primitive to a page, you do that with a URL parameter.

If you want to display data about some Thing, you need to make that Thing. WHAT IS IT EXACTLY THAT YOUR USER IS SELECTING ON PAGE A?

It sounds like your page is like:

Click a picture of a taco: [taco picture 1] [taco picture 2]

But the tacos do not represent anything. Don’t do this. There’s never a reason to do this.

Instead, the tacos should in fact objects of type Taco in your database. A Taco would have fields such as name (a text), image (an image), meat (a text), toppings list (a list of texts). Get it?

When I click taco picture 1, NOW AM SELECTING AN ACTUAL Taco. I can pass the Taco to the next page. I can put the Taco in a shopping cart. I can edit the Taco. See?

The “Taco” I describe here can be anything. For your app, I guess it’s some sort of real estate thing. Make that thing.

Ok Keith! Thanks so much for all your help… the type was the issue!

I do have another question for you though…

Again looking at a real estate listing app…

I have addresses listed on a page and each listing needs to have a bunch of photos attached.

Thinking of this app - not from a buyer user but from the real estate agents point of view…

Is there a way I can, use a pop up to upload many photos that store to one of those addresses on the list?

TIA!!!

Hello. You can do this. You just need the fields in your data type. You will have data type “listing” the listing has:
Agent: user
Title: text
Address: geographic address
Description: text
Photos: list of images
Leads: list of users (maybe people who favorites, or inquired)
Listing date: date
Days on market: number
Price: numby

And any other fields you may need.

For your agent, just create a multifile uploader and use it to save the uploaded images to the photos field.

1 Like

Thanks for this!

How do I get the “listing” to only show the first image uploaded by the “agent”?

When the “agent” clicks on that one picture, a new page opens displaying all pictures uploaded

You can append the search constraints. So, in your repeating group may have “do a search for” and search for the type “listing”. One constraint may be “created by=current user” this only shows listings created by the current situation user. Once your search parameter is in place, you can then modify it.

When displaying data in your group, you could create an image element, and its data source would be “this cell’s list of photos: first item” which would display only the first item on the list.