Displaying Data in a Table?

Hi Team!

I’m trying to create a table like this

When a user clicks on an element in the table, that choice is added to their portfolio of “bets.” [No actual betting transacting here :wink: ]

I have created a table / records of this data in my app, but what’s the best way to draw such a table and call in this data?

Hello @jwithington! Welcome to the Boundless community forums! :tada: :smile:

No actual betting transacting here

Glad to hear it :sweat_smile:

There is no way to add an actual table to your app (not yet anyway), however you can style rows & columns to look like this.

Modeling this data is actually fairly involved, I’m not sure how well-suited it is to a post in the forums, but I’ll do my best to illustrate things without getting too bogged down in the details. The first item is how to display data from Games (I assume you have a Table called Games here).

  • The first step is to drag a Record List into your page and configure it to show data from the Games Table.
  • Then you drag some Text nodes in, side-by-side which will automatically create Columns to hold those Text elements.
  • Then you select the Row using breadcrumbs in the sidebar or the Structure dropdown available in the top left and copy the Row in place twice.

Now you have 3 Rows with 4 Columns, and you can style the Columns appropriately (done in the sidebar). Here’s a video I made to illustrate.

As for adding to a portfolio of “bets”, I think you need a Form element in each Column to create a Bet. Here’s another little video I made to illustrate how you could let your users to make “bets” on these different elements. Sorry I’m not a betting man myself so I’m not sure I fully understand how these bets are setup.

1 Like