Clear forms or access data in elements inside Listviews

App Building
,
1

Dear Community:

I have a list view (the new one) in where I add a form.

image
image1593×600 134 KB

I would like to add a button to clear all values in all forms.

When I run:

rateForm.clear()

Only the first form clears.

I have tried doing something like (its a nested list view):

for (let i = 0; i < rates.value.length; i++) {
  rateForm[ri[0]][ri[i]].clear()
}

But I get the message: "Cannot read properties of undefined (reading 'undefined')"

Any idea what I am doing wrong? Or if this is supported with the new version of list view?

2

This is what I see in the form state:

image

3

I need to find a way to do this.... please help! I can't find a way to clear the inputs, even though I set the initial input values to be the rates values. Once I change the input, it doesn't reset!

4

Update:

I have come to the conclusion that there is NO WAY to acces a specific component inside a list view such as form[1].clear(). When i print rateForm as console.log(rateForm), it only prints 1 form.

I can only clear each form in each iteration with a button. There is NO WAY to clear all of them at once... I will have to use the legacy listView

5

Sadly yes that is true.

They changed the new List View to prohibit external referencing of the listview data (so they can optimise performance). :face_with_raised_eyebrow:

It means the listview is a bit of a strange component, it is not "table-like" as the old one was. I'm yet to work out if the new one fits my use case. Good luck with your apps!

1 Like
6

Just if anyone stumbles with this problem, this is the solution that I found.

As the form is filled with the default value set-up from a variable, if I change the value in the input, this new value stays set in this input. I had implemented the option to delete a row but the next row that took the deleted row's place had its input values replaced with the deleted row's values.

What I did was:

  • There is a variable that mimics the listView values. So listView values are read-only.

  • On each input of listView: add scripts that runs "on change" to edit the source variable example: rates.setIn([ri[0], "variable", i, "variable1"], variable1Input.value)

  • In this same script, I add rateForm.clear, which runs only for the row which you are editing. This clears the input hard-coded value and it is filled with the same value that you just updated, just not hard-coded.

  • As the value in the input isn't hard-coded, when you delete a row, reset values or whatever; the inputs are filled with the values from the variable.

1 Like