How to use FormField in a form?

[M1kep]

In the docs it mentions that the FormField is merely presentational. As a user of the package, how would I go about getting these inputs into a form?

While testing I've been using something like the below. In the generated output I see the <input> element: <input class="s-e-RHDHaMeaUM" > but for some reason I can't seem to get the values. I feel like I'm just missing something simple here, but I'm not too sure.

Thanks

<script>
    import {Button, FormField, TextField} from "attractions";

    function onSubmit(e) {
        const formData = new FormData(e.target);
        const data = {};
        for (const [key, value] of formData.entries()) {
            data[key] = value;
        }
        console.log(data);
    }
</script>

<form on:submit|preventDefault={onSubmit}>
    <FormField name="Main Field">
        <TextField/>
    </FormField>
    <Button type="submit">Submit</Button>
</form>

[illright]

Hi! The trick is to have all your input elements named, i.e. setting a name attribute with the value of a key that you'd want to be in your FormData.

This works a treat, just tested:

 <form on:submit|preventDefault={onSubmit}>
     <FormField name="Main Field">
-        <TextField/>
+        <TextField name="something" />
     </FormField>
     <Button type="submit">Submit</Button>
 </form>

Let me know if you have any more questions with this.

[illright]

I take it that there are no more questions with this, so I'll close this issue. Feel free to reopen it, open a new one or even start a thread in Discussions if you have any further queries.