[React] Checkbox uncheckt niet in Firefox

[Devilly]

Ik heb een React component gemaakt die een checkbox rendert. Deze werkt prima in Chrome 44 (44.0.2403.155 m) en IE 11 (11.0.9600.17937), maar in Firefox 38 (38.0.5) uncheckt de checkbox niet. Ik gebruik het checked attribuut. Met defaultChecked in plaats van checked werkt het wel.

Een versimpelde case heb ik uitgewerkt in een jsFiddle waarbij ik de checked variant vergelijk met de versie met defaultChecked. Achter de checkboxen laat ik zien wat de waarde van de checked property van de desbetreffende checkbox is nadat op de checkbox is geklikt. Ik kom er niet achter waarom field.checked op regel 6 van de JS in de fiddle in Firefox altijd true geeft, terwijl hij in de andere browsers op het uncheck moment wel de waarde false aanneemt.

Kan iemand mij vertellen wat ik over het hoofd zie?

[André]

Probeer eens de click event listener ipv de change

[endness]

Probleem van de click-listener is dat ie niet werkt als iemand met het toetsenbord de value veranderd.. Ik weet niet in hoeverre dat belangrijk is in dit geval, maar wel iets om rekening mee te houden.

[Devilly]

André schreef op vrijdag 21 augustus 2015 @ 13:14:
Probeer eens de click event listener ipv de change

Dat werkt, maar ik ga de toetsenbordgebruikers niet zo hard buitensluiten, zoals endness al aangeeft dat ik daarmee zou doen. Eigenlijk wil ik gewoon weten waarom dit niet werkt. Workarounds kunnen altijd nog toegepast worden.

[crisp]

HTML:

<input type="checkbox" checked=true>
<input type="checkbox" checked=false>