Making an idea voting board - How would you approach it?

Anvil Q&A
1

I’m looking to create an idea voting board where people can submit ideas in a textarea which will be stored in an Anvil table.

  • The submitted ideas will appear in the app as cards which can be voted up or down by clicking an up or down button.
  • The idea cards are automatically ordered by highest votes to lowest votes.

It would be something like this, but much simpler and cleaner:

image
image1040×497 27.8 KB

I’ve been using Anvil for a couple of months now, but don’t have much experience with using the repeating panels or data tables, which I am guessing is what will be needed.

How would you approach it, broadly speaking?

2

This tutorial might be a good place to start: Anvil | News Aggregator

3

If you are not familiar with Repeating Panels much, I will also suggest that you try Linear Panel or Links. I find it far easier to get the rows from the table in a list comprehension and run a loop to add those contents to a linear panel. If you want more help, a clone link might help

4

https://anvil.works/build#clone:P22KREREBCXZ4D2C=X24KAHLPPFC4QJXXZ2XVKYHJ

If you do not want to use Repeating Panel, that’s the alternative way. If any part is unclear or if you need more help, feel free to tell me

1 Like
5

I’ve chosen to follow the linear panel route. The example you provided has started me off in the right direction and saved me time, thank you!

1 Like
6

You’re welcome. If you need any more help please tell me. My website also involves heavy use of displaying data from a data table in Linear Panel so I will be glad to help.

1 Like
7

Personally, I’d be using a data grid or a repeating panel for this with a list of objects as its ‘items’ property.

When votes are cast, I’d regenerate the items list in the correct order and refresh the binding for the panel.

3 Likes
8

As @hugetim suggested, I’d highly recommend following the News Aggregator tutorial, which takes you step-by-step through using a repeating panel for a similar application. This will also eliminate some of the issues you’ve described in your other post: Referencing dynamically generated components.

3 Likes
9

So I’ve created the voting board:

I used the repeating panel method. It was straightforward to learn and set up, and saved me more time in the long run. Thanks everyone for your help and advice!

2 Likes