I have a form set up with redux-form to supply the initial values (although it also handles the values so that they're changed in the redux store too) as so below.
But my checkboxes are unable to be interacted with. They always stay checked (which is their initial value based off the model supplied)
My render method: (I copied the renderCheckbox from this documentation.
render() {
const {classes} = this.props;
const renderTextField = ({input, label, meta: { touched, error }, ...custom}) => (
<TextField
error={touched && error}
{...input}
{...custom}
/>
);
const renderCheckbox = ({ input, label }) => (
<Checkbox
label={label}
checked={input.value ? true : false}
//onCheck={input.onChange} // I had this enabled but it didn't do anything
/>
);
const { submit, handleSubmit, pristine, reset, submitting } = this.props;
return (
<form onSubmit={handleSubmit(this.props.sendSubmit)}>
<Paper className={classes.sectionPaper}>
<CardContent>
<Typography className={classes.sectionHeader}>Artifact Info</Typography>
<Divider />
</CardContent>
<CardContent>
<Grid fluid>
<Row>
<Col xs={12} lg={4}>
<CardContent className={classes.artifactCardContent}>
<Typography>Artifact Name</Typography>
<Divider />
<Field
fullWidth
name="Name"
component={renderTextField}
label="Artifact Name"
/>
</CardContent>
</Col>
<Col xs={6} lg={1}>
<CardContent className={classes.artifactCardContent}>
<Typography>Mythic?</Typography>
<Divider />
<Field
name="Mythic"
component={renderCheckbox}
label="Mythic"
/>
</CardContent>
</Col>
</Row>
</Grid>
</CardContent>
</Paper>
</form>
);
Edit: Figured it out. The issue was between material-ui@next and material-ui v1.0 they changed checkboxes to use checked for always being checked (based on an initial value), and defaultChecked to be a default value.
