How To Check checked value of a checkbox using Reactstrap

Question

I've got a React web app using bootstrap 4 and Reactstrap. I want to have several checkboxes in a toolbar and I can't figure out how to get anything out of the onChange event besides "on".

Here is my code that continues to write "on" to the console every time I click the checkbox. The checkbox does toggle on and off.

     <li className="show-sessions">
        <FormGroup check>
          <Label check>
            <Input
                type="checkbox"
                onChange={(e) => console.log(e.target.value)}
            />{" "}
            <strong>Show Favorites</strong>
          </Label>
        </FormGroup>
      </li>

Is there another way to make a checkbox in Reactstrap? The doc's are very limited.

Mechanic · Accepted Answer · 2020-10-08 22:26:36Z

7

you can check checked state rather than value; it is a boolean

<Input
  type="checkbox"
  onChange={(e) => console.log(e.target.checked)}
/>

answered Oct 8, 2020 at 22:26

Mechanic

5,4484 gold badges19 silver badges44 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Pete Over a year ago

Thanks @Leonardo, is there a more "reactstrap/bootstrap" way to get a styled checkbox out? This one is not in align and I'm totally not a css or bootstrap person. dropbox.com/s/9rc07wozvdxstnk/checkboxugly.png?dl=0

Collectives™ on Stack Overflow

How To Check checked value of a checkbox using Reactstrap

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related