Change the order of a filled input in a collection

Hi everyone, I have an interesting issue… I have a table that is dynamically filled by a variable and contains inputs. I created the ability to change the order of the rows with a couple of workflows/buttons, but I quickly realized that if an input has been filled, that input does not move with the rest of the row (or perhaps it’s more accurate to say that the data inputted does not move).

Check out the image below. The up down arrows will move the row of data as expected, but the highlighted value will not move. Any ideas on how to fix?

I think you need to manipulate the variable as well. Otherwise you go out of sync.

I’m just not sure how to manipulate the variable because the inputs don’t show up in the workflow editor.

Input variable don’t show up in collection lists but you can keep track of the values using the chenge workflow. You can find an example here

I did something similar to track the values, but the I need to actually be able to set the value of inputs, not just track them.

For example, if the second row of data has the ‘artist name override’ field filled, and I move that row of data up, I need to wipe the second row’s ‘artist name override’ field and set the first row’s ‘artist name override’ field to the previous value from the second row. I know how to keep track of the value, I don’t know how to wipe/set values of inputs in specific rows.

It would be a little more complicated logic, this would require some engineering, which is a little out of scope of the community I guess. But As Mariano mentioned in the thread he sent, you can track it like that and then manipulate it via some custom JS I think. You could either use copilot or get someone to do this.

I know how to write javascript, so if I knew how to reference the input this would be no problem.
I suppose I could try getting the element by ID.

https://www.loom.com/share/d6e1f75fb3be4b96900b9a5349d3092d

Thanks for the help. Hopefully this video helps demonstrate my issue

If you keep track of the values you can also assign them to the inputs. Simply bind the “initial value” property to the variable where you store the change. It’s all doable with nocode.
See this example where you can keep track of a list of checkboxes, but also change their value dynamically.

I think you could work with an array and their indexes, for example the relationship of index of your selectedRow and the input value index within an array storing all the values. Or you might bind the values via the id, so you can call it then via id.

I found a very simple way, not the best, but simple. You can still access the data via the dot notation, it just doesn’t show in the editor visually sometimes.

Edit: I also made it work on the datagrid, so this should be doable)

1 Like

This is what I mean:
chrome_jW1V4fGgg3
100% doable in weweb without code, not even in the bindings.
I’ll post a tutorial with instructions as soon as I have some more time :slight_smile:

1 Like

I think we made a very similar thing :smiley: Confirming this is doable.

Indeed we both did it, just with a different data structure. Using directly js is my preferred method, but you can also do it 100% without code. :slight_smile:

Indeed, you can make this happen in nocode for sure, but I’ve rather used some js as well, it just comes faster to me) Sometimes I find the formulas too complicated haha! I can’t see what’s happening underneath, so I’m like, rather using js.

1 Like

Thanks so much guys! There is indeed multiple ways to do this.
It ended up being really easy to implement. Since I already had an object that tracks the inputs, I just added a dynamic init value to the inputs as shown:

1 Like