SolidJS Array Field Not Working

[alexvuka1]

Describe the bug

I have tried to follow the example given in the docs (link) as closely as possible, but with no luck. Adding a new field works, but typing in it results in the field disappearing. Also, typescript is not happy with type checking of the index prop and when calling the handleChange function.

Your minimal, reproducible example

https://stackblitz.com/edit/solid-vite-fpsaqi?file=src%2Findex.tsx

Steps to reproduce

1. Click the 'Add name' button
2. Start typing in the field

Expected behavior

As a user I expected the be able to type into the array field.

How often does this bug happen?

Every time

Screenshots or Videos

No response

Platform

• OS: Windows/WSL2
• Browser: Chrome
• Version: 120

Tanstack Form adapter

solid-form

TanStack Form version

0.13.3

TypeScript version

5.3.3

Additional context

No response

[crutchcorn]

While investigating array bugs in #588, I noticed the same behavior until I switched from For to Index, which seems to also solve your issue:

https://stackblitz.com/edit/solid-vite-zwjafu?file=src%2Findex.tsx

I'm working on adding docs to how to use arrays in TanStack Form and will mention this here as well

[alexvuka1]

I see, thanks. I checked out the Stackblitz playground you provided and it works for the most part, however, clicking on the X button still doesn't work. i is now just a number, so I changed namesField().removeValue(i()) to namesField().removeValue(i) but even then clicking the X button removes all of the array fields.

[crutchcorn]

Likely a simple fix on our end. Let's open a new issue to track that :)

[alexvuka1]

Created a new issue: #618