How to pass around component values as FormData

[yongtao-wang]

Hi,
For Mantine components, using Chip/Chip.Group as an example, how do I pass the value into FormData?

<Chip.Group multiple={false}>
    <Group justify='left'>
        <Chip value='male'>Male</Chip>
        <Chip value='female'>Female</Chip>
    </Group>
</Chip.Group>

The component does not allow me to use the traditional method by setting up "name" attribute.

Currently my form is using Next.js useFormState hook so cannot use Mantine's useForm

[rtivital]

Chip components are regular input elements with type radio or checkbox, you can pass props down to them the same way as to regular input

[yongtao-wang]

Thanks for the answer.
Besides I noticed that defaultChecked won't work for a chip group e.g. the snippet in the question. Is that intentional? What's the correct way to set up default checked in a group?

[rtivital]

if you use uncontrolled forms, there is no reason to use Chip.Group, use just Chip components

[yongtao-wang]

I believe the docs is using Chip.Group to make exclusive selection for uncontrolled forms too.
https://mantine.dev/core/chip/#controlled-chipgroup