Create a dynamic table

Hi,

Anyone know how to create a dynamic table so that you can insert rows in a table like in this jsfiddle: http://jsfiddle.net/charlietfl/k2QWc/

It would be awesome to have that for adding lines when you want to create lines on an invoice for example.

Thanks a lot everyone.

1 Like

The program runner there gives you a hint:
You can add blank values to a Repeating Group’s Thing

Set the values of the Repeating Group inside inputs (and when the input is changed, Current Thing’s thing = inputs value)

3 Likes

Things in Bubble don’t really work like this. Instead, you’re going to have a repeating group that displays a list of things (usually the result of a search), and then when you create a new thing (or delete one), the repeating group will show or hide a row accordingly.

Have you done the Voting app lesson? you’ll see how that works there.

Yes, I´ve seen the voting app but it´s not the good way to achieve that in terms of user interaction. Will it be possible with javascript?

Thanks a lot.

Bubble doesn’t let you to explicitly use JS in your app yet, except through some custom blocks in Blockspring, but I don’t think that’s what you want here, unfortunately.

You are right.

Thanks a lot Emmanuel.

Emmanuel,

I´ve seen somewhere on the forum that you can insert Javascript on the body. Am I right?

Will it be possible then?

Thanks.

Am not sure why you wouldn’t have an “add new row” button that inserts a blank row in the table.

1 Like

Hello NigelG,

I want to achieve something like in this fiddle: http://jsfiddle.net/charlietfl/k2QWc/8 and if you mean to do with a repeating group, it does not make the same.

That´s what you meant?

Thanks.

That link doesn’t seem to work, could you repost?

You´re right. Here´s the good one: http://jsfiddle.net/charlietfl/k2QWc/

Adding a row to a repeating group is very particular to Bubble and the way it connects to the backend, using JS here won’t really help. But you can make this work just using the visual editor.

I´ve tried that but it´s not possible to make an inline edit inside the repeating group, right?

What do you mean? If you modify a thing, the row will update automatically. Have you tried the voting app lesson?

Yes, I´ve tried the voting app. I´m really newbie here maybe I´m not understanding. But as you can see in the fiddle when you insert a new line you can edit the whole line. I could not get it to work on Bubble.

Just put some inputs in the repeating group and you can edit the entry in each row (with the right workflow).

I´ve tried Emmanuel but I can´t figure out how. I don´t really know what action to pick in the workflow.

Here´s what I have:

Would like to have a repeating group with no repeating capabilities to use as grid (for display purposes) and place elements in them. Will save a lot of time not to have to create my own.

Can you elaborate? Not sure I follow here.

You need an input in the repeating group and then the event is ‘when an input is changed’, and the action is change a thing.