I have a react sign-up form. I want to set up an input (checkbox) that holds the value as some text - e.g:

<form onSubmit={this.validateStepTwo} id="registerForm">
    <label htmlFor="short_bio">Tell the users a bit about yourself:</label>
    <input type="textarea" name="short_bio" className="textarea-small"/>

    <label htmlFor="bio_info">Tell the users who you are</label>
    <input type="textarea" name="bio_info" className="textarea-large"/>

    <label htmlFor="bio_exp">Tell the users what you did</label>
    <input type="textarea" name="bio_exp" className="textarea-large"/>

    <input type="checkbox" name="instructor" value="I want to be an instructor" />

    <input type="submit" value="Register" className="submit"></input>

    {this.state.errors !== null ? (
        <h1 className="error">{this.state.errors}</h1>
    ) : ('')}
</form>

Where

<input type="checkbox" name="instructor" value="I want to be an instructor" />

should have a value of "I want to be an instructor" but it doesnt have anything.

I tried doing it like this:

<input ...>I want to be an instructor</input>

but that threw another error.

Is this a react thing or am i missing something in my code? Ive been on the computer for 13 hours so i wouldnt be surprised if i made a dumb mistake.

1 Answers

1
A Ghanima On Best Solutions

Checkbox input value is the one sent in the request and not the text that appears afterwards.

If you want it to be the text then do something like this

<input type="checkbox" name="instructor" value="instructor"> I want to be an instructor