I create a form in React, there is an option in which you can select a state (for example, Alabama, Alaska, etc.) if a certain select flag is set.
The problem that occurs when unchecking the state selection component is not removed.
Input = require('react-bootstrap').Input
States = require('./States.cjsx')
module.exports = InputForm = React.createClass(
propTypes:
state_checkbox: React.PropTypes.bool
getInitialState: ->
{
state_checkbox: false
}
toggleStatesField: ->
console.log('Toggle state changed' + @refs.state_checkbox)
@setState({ state_checkbox: @refs.state_checkbox })
showStatesField: ->
if @refs.state_checkbox
<States />
else
false
render: ->
return(
<Input type="checkbox" ref="state_checkbox" label="Import State?" onChange={@toggleStatesField} value={@state.state_checkbox} />
{ @showStatesField() }
)
)
In the response dev extension, the initial state is set to false. When an item is switched, it shows Input{...}while the state is in that object null.
I believe the problem is that it state_checkboxreturns an object instead of a boolean. I searched, but cannot find a way to update the state of the object Input{...}with @setStateor change it as a boolean from propTypesabove.