CODEWITHSUNDEEP
reactjscheckboxformik
geeberry
geeberry

Reputation: 675

How to send value of a checkbox using Formik

I am making a formik form and every field sets and sends values correctly except my checkbox field. I can't really find good documentation on it so was wondering if anyone could help me.

My props to values formik function:

  mapPropsToValues: props => ({
    firstName: props.firstName || '',
    lastName: props.lastName || '',
    businessName: props.businessName || '',
    email: props.email || '',
    phone: props.phone || '',
    zipCode: props.zipCode || '',
    yearsInBusiness: props.yearsInBusiness || '',
    callBackTime: props.callBackTime || '',
    paymentServices: [],
    paymentProcessing: props.paymentProcessing || ''
  }),

And my input field.

 <CheckboxField
   type="checkbox"
   name="paymentProcessing"
   value={values.paymentProcessing}
   label="Payment Processing Equipment"
  />

I basically need the value of the checkbox field to equal to label if checked

Upvotes: 5

Views: 7964

Answers (1)

Neil
Neil

Reputation: 968

This depends on your values prop in <CheckboxField />, but natively input’s use event.target.checked when the correct type is added.

Try checking what value prop appears in the component, also if your props for paymentProcessing, is not present you are sending a string:

paymentProcessing: props.paymentProcessing || ''

I would check values in the checkbox component and return undefined if there is no Boolean from paymentProcessing prop.

So you will not need an empty string above either, remember your are not dealing with a string with checkboxes.

Upvotes: 2

Related Questions