How to map elements of array to an input?

Question

I have a state variable which is an array. Each element is a string. I am trying to map each element to a checkbox input type, but it fails.

When I try to map them to a p tag to segregate each element into different paragraphs, it works. But when I use input type it shows blank.

return (
  <div className="pdf" id="check">
    {this.state.content.map((txt) =>
      <p><input type='checkbox' value={txt} /></p>
    )}
  </div>

Here this.state.content is an array of string elements, and with only p tag it works fine but after including input tag it renders the checkboxes but content is blank.

I need a checkbox at the start of each element when I print it.

Jonas Wilms · Accepted Answer · 2019-08-27 07:52:01Z

2

There is no such thing as the "value" of a checkbox. It is either checked or unchecked. To show some text next to the checkbox, add some text outside of it:

 <p>{text} <input type="checkbox" /></p>

answered Aug 27, 2019 at 7:52

Jonas Wilms

139k20 gold badges164 silver badges164 bronze badges

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

Collectives™ on Stack Overflow

How to map elements of array to an input?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related