How to populate array with checkboxes?

How to populate array with checkboxes?

Hi, I’m wondering if it’s possible to do this. I have 2 check-boxes, and every time one is checked, an array should be populated. I’ve been playing around, even tried the latest FieldArray, but I’m not sure I understand well how to use it, or even if it’s for that purpose.

Info

I am using Formik component with render method. Something like:

import React from 'react';
import { render } from 'react-dom';
import { Formik } from 'formik';


const App = () => (
  <div>
    <h1>My Form</h1>
    <Formik
      initialValues={{
        groups: [],
      }}
      onSubmit={values =>
        console.log(values)
        // Expected output would be something like:
        // {groups: ['admin', 'normal']}
      }
      render={props => (
        <form onSubmit={props.handleSubmit}>
          <input
            type="checkbox"
            name="groups.0"
            value="admin"
            onChange={props.handleChange}
            onBlur={props.handleBlur}
            checked={props.values.groups === 'admin'}
          />
          Admin
          <br/>
          <input
            type="checkbox"
            name="groups.1"
            value="normal"
            onChange={props.handleChange}
            onBlur={props.handleBlur}
            checked={props.values.groups === 'normal'}
          />
          Normal
          <br />

          <button type="submit" >
            Submit
          </button>
        </form>
      )}
    />
  </div>
);

render(<App />, document.getElementById('root'));

Here is an example: https://codesandbox.io/s/03pmmoo0kp

But what I really want is to have this as a result:

{
  groups: ['admin', 'normal']
}

Is it possible doing something like that? What am I missing?

• Formik Version: 0.11-beta
• OS: Debian unstable
• Node Version: node@v8.6.0
• Package Manager and version: yarn@1.3.2

[elado]

Example for a checkbox array using FieldArray: https://codesandbox.io/s/o5pw1vx916

[adamduncan]

@jaredpalmer - now v0.11 is released and FieldArray’s stable, is it possible to add examples of creating fieldsets of multiple radio and checkbox inputs please? Seems such a common feature of forms, but yet to see a definitive example in the docs. Thanks!