Material-ui: Checkbox fails for checked={true}

[georgeneil]

Problem description

Setting the default value will not work if we use the property 'checked'

Link to minimal working code that reproduces the issue

Checkbox toggle is not working if we used checked={true}
~

~

Checkbox toggle will work if we use defaultChecked={true}
~

~

Versions

• Material-UI: 0.18.1
• React: 15.4.1
• Browser: Chrome 58.0.3029.110

[Gyran]

When you use the checked prop you are controlling the checkbox, i.e. you must listen to changes on the checkbox and update the checked property to be sure it is displayed correctly. If you use defaultChecked you initialise the internal state of the Checkbox to true and then let the Checkbox be uncontrolled i.e. it keeps track of the checked status internally.

You can read a bit more about it on the documentation page http://www.material-ui.com/#/components/checkbox and about controlled components at https://fb.me/react-controlled-components

[georgeneil]

From the sample code, the user may get a feeling to use the checked property.

Is it better to add a sample code for 'defaultChecked' too ?

[oliviertassinari]

We have been porting the component on the next branch. We reimplemented it from the ground-up. While we haven't tested it, I think that the issue is most likely fixed on that branch. Hence, I'm closing it.

[stevematdavies]

This is still an issue for react 16 unfortunately