gumby.checkbox.js - labels not wrapping checkbox don't properly check input
Closed this issue · 0 comments
subimage commented
Regularly, if you have an input inside a label, like so the gumby js checkbox code works properly.
<form class="field">
<div class="checkbox">
<label>
<input type="checkbox" id="mybox" />
<span></span>
Some text
</label>
</div>
</form>
However, if you must structure your HTML like so, the checkbox doesn't actually get checked...
<form class="field">
<div class="checkbox">
<input type="checkbox" id="mybox" />
</div>
<!-- label not containing checkbox -->
<label for="mybox">
Some text
</label>
</form>
I did some deep debugging, and seems that the checkbox DOES get set within the Checkbox.update function, but after if you inspect that same input it's NOT checked.
I solved this in my own code by modifying gumby.checkbox.js to call a window.setTimeout to change the prop - but obviously something weird is going on here. Please fix!