Formik: Field's value for checkboxes and radios is not being read properly

Created on 19 Oct 2018  路  16Comments  路  Source: formium/formik

馃悰 Bug report

Current Behavior

Field's value for checkboxes and radios is not being read properly.

Expected behavior

Values for checkboxes and radios should be read from Formik state and not from props.

Reproducible example

https://codesandbox.io/s/r1r6x1wp94

Suggested solution(s)

I think the problem lies here: https://github.com/jaredpalmer/formik/blob/master/src/Field.tsx#L155-L158

I believe that by changing:

      value:
        props.type === 'radio' || props.type === 'checkbox'
          ? props.value // React uses checked={} for these inputs
          : getIn(formik.values, name),

To:

     [props.type === 'radio' || props.type === 'checkbox' ? "checked" : "value"]:
       getIn(formik.values, name),

The issue would be resolved.

Your environment

| Software | Version(s) |
| ---------------- | ---------- |
| Formik | 1.4.2
| React | 16.7.0

stale

Most helpful comment

This is still a problem...

All 16 comments

I also have this issue where checkboxes aren't binding correctly.

What's also interesting is that it doesn't seem to be respecting the value passed to props either:

https://codesandbox.io/s/n5ozork8vm

I would expect isEnabled to be the value of the input when it's checked, test, in this case.

Hola! So here's the deal, between open source and my day job and life and what not, I have a lot to manage, so I use a GitHub bot to automate a few things here and there. This particular GitHub bot is going to mark this as stale because it has not had recent activity for a while. It will be closed if no further activity occurs in a few days. Do not take this personally--seriously--this is a completely automated action. If this is a mistake, just make a comment, DM me, send a carrier pidgeon, or a smoke signal.

ProBot automatically closed this due to inactivity. Holler if this is a mistake, and we'll re-open it.

@jaredpalmer I think this issue should be reopened

@jaredpalmer I agree. Not having the ability to get the value from a checkbox or radio limits formik awesomeness!!!

I was trying to look through the docs and I can't figure out how to get the value from a radio input. Is this issue closed?

I would love to see this feature implemented.

+1

@smithcoin I believe this is the minimum working example for radio buttons: https://codesandbox.io/s/88jqoy4qvl

This is still an issue

Why was this issue closed? The bug still exists.

This has been fixed in v2.

@jaredpalmer when is v2 going to be released?

@jaredpalmer We're using v2.0.1-rc.5 and it seems like we still have this issue. Basically the same setup as in @hnordt's codesandbox, except we're using useField() instead of <Field>. Not sure if we're doing anything wrong, but other types of inputs work just fine.

@smithcoin I believe this is the minimum working example for radio buttons: https://codesandbox.io/s/88jqoy4qvl

This is the only solution that worked for me after 4 hours of banging my head

This is still a problem...

Was this page helpful?
0 / 5 - 0 ratings

Related issues

jaredpalmer picture jaredpalmer  路  3Comments

green-pickle picture green-pickle  路  3Comments

PeerHartmann picture PeerHartmann  路  3Comments

jeffbski picture jeffbski  路  3Comments

ancashoria picture ancashoria  路  3Comments