Need a table that colors cells that have a value of 1 and no fill on 0

MeatPak · 2024-07-19T02:49:25.452Z

Hi - I’m trying to make an excel like table that is a set size with cells that are shaded according to their value. This value needs to be toggled between 0 & 1 when the cell is clicked on. I have tried a repeating group with data coming from a delimted string value. This works OK on load but I can’t find a way to write any changes back to the database as it is a delimited string rather than individual fields.

I could have individual fields with a text input and a button for each and have it autobinding but the issue with that is that the grid needs to be 15 x 25 so 375 fields, inputs, buttons and associated workflows to set up which is not very efficient.

Any suggestions?

animisha45 · 2024-07-19T03:27:27.111Z

Two solutions. Depending on what your data structure is, and how many workflows etc you have.

Use the element Table. You can have the conditions to show a specific background color etc.
Use Repeating group. RG will have 1 row and multiple columns. Within the repeating group you can add the details, inputs, and respective button for workflow.

I am assuming your data is dynamic.

MeatPak · 2024-07-19T07:15:27.111Z

Thanks. I thought of a table element but not sure how i could directly toggle the cell value between 1 & 0 by clicking on it. The following is the idea in excel i am trying to recreate. The layout needs to be saved and able to be reloaded again and modified

image1488×650 8.32 KB

bonjour_17 · 2024-07-19T08:22:14.920Z

If you say that it works with individual fields but having to reproduce 375 times the same workflows is tedious (it is): maybe reusable elements could be your thing.

Each field is 1 RE wth it’s a workflow that ses the value of the cell.

For this to work you’ll need to sav each cell as an object

ed19 · 2024-07-19T11:17:29.709Z

How you’ve designed your database is key here. If each cell is an individual “thing” then this is incredibly easy to implement with a repeating group.

If each is a line item containing 15 separate binary key/value pairs, then you’d likely need to set up 15 separate workflows without use of a reusable as @bonjour_17 has suggested.

animisha45 · 2024-07-19T12:10:28.832Z

Could you give a screenshot of your database that you want here? I can give more specific solution then.

MeatPak · 2024-07-19T23:21:15.919Z

@animisha45 - I haven’t settled on a data structure as I am trying to work out the most efficient and scalable way to achieve this particular function.

This grid is the layout of storage tanks and drives calculations like volume, weight, length etc.

A user will log in, set up a project, add multiple layouts to the project. They need to be saved and accessed multiple times as the designs change.

ed19 · 2024-07-20T00:33:15.640Z

@MeatPak like this?

Bubble

Bubble - Visual Programming

Build stuff without code and launch a startup without a tech-cofounder! Bubble is a visual programing language. Instead of typing code, use a visual editor to build applications.

MeatPak · 2024-07-30T06:35:54.220Z

@ed19 - sorry I got diverted off this project for a few days and didn’t see your reply.

Yes like this!!! Working on replicating this now.

Thank-you very much for your help.

ed19 · 2024-07-30T09:54:29.280Z

To be honest I’ve forgotten a little at this point, but I can see I used a standalone line item for each row, all housed in a parent design (I know you have a higher level project datatype, but that’s easy enough to do).

App is here:

Bubble

Bubble Editor - Test Area

Build stuff without code and launch a startup without a tech-cofounder! Bubble is a visual programing language. Instead of typing code, use a visual editor to build applications.

Quick notes from checking it over just now:

1 thing per row (design line item)
1s and 0s housed in a single list of numbers named “binary” on each design line
Design line items duplicated from lines marked “template” on design creation. This is inefficient but my test page has no backend wf access, so I threw it together the first way that came to me. Should probably be done via bulk api creation instead.
On click I’ve used the set function on the binary list to modify it, with current cell’s index indicating where the change is needed (there’s also a reverse action):

image1382×664 71.2 KB

The last action there could all actually be done in 1 line, by replacing the condition on the workflow with an inline format as text if statement.

MeatPak · 2024-08-11T05:41:07.496Z

I now have a list of 0’s & 1’s in a field, & have a repeating group which has a field returning the index of the first 1 in the list. i.e in the image below the first 1 in the first list is the 6th record in the list, the first 1 in the second list is in the 7th position, the first 1 in the third list is in the 6th position and so on.

image855×64 1.22 KB

I need to get the largest index number from this repeating group i.e. 7 in the list above. The trouble I am running into is that this number is a dynamic value based on the current cells data and not a data value itself.

I am using a plugin to return the index of the 1 with in the list.

I think it should be able to be done using custom states although haven’t had any success in getting this to work.

Any ideas?

ed19 · 2024-08-11T09:46:59.627Z

You should be able to use the max operator for this, so to get a single line:
Current cell’s (on the parents RG) design line item’s binary:max

To get the highest number on the whole page it’d be something like:
Rg design’s design line items:each item’s binary:max:max

And if that’s not an option for the whole page, use format as text with a comma delimiter:
Rg design’s design line items:each item formatted as text(this line item’s binary:max):split by(,):each item converted to a number:max

peter.mccorkell · 2024-08-12T05:07:48.251Z

Thanks - I can;t get that to work.

I think the difficulty I am running into is that I am not getting a result from the binary but rather the index of the fist 1 within the binary list. This is coming from a plugin in the repeating group so the data is not saved in the database but dynamic on the page which is why i thought custom states may be the answer. My next approach is to write the index value to the database on value change but this may cause performance issues.

jacob2 · 2024-08-13T05:16:18.056Z

Its so much easier to just use Modulo

ed19 · 2024-08-13T13:23:23.266Z

Unsure what the intended modulo use is here but if there’s an easier method then by all means.

@peter.mccorkell it’s tricky to help further with the limited information above, it all depends quite heavily on the setup. What I’ve provided for you is just an option to illustrate a potential pathway, but may vary if you have specific 3rd party applications with their own requirements or other external factors.

You could have each cell as it’s own “thing” if it suits, which may then in turn make it easier to work with an embedded app inside your rg.

system · 2024-09-27T02:50:13.354Z

This topic was automatically closed after 70 days. New replies are no longer allowed.