|
Am having a problem with the click event on checkBoxGroupOptions. Everything works properly when just the checkbox is clicked. However, when clicking on the checkbox's associated text, it fires the click event, but fails to check or uncheck the checkbox.
<b:checkBoxGroup>
<b:checkBoxGroupOption id="myCheckbox">
<span>My Checkbox</span>
<e:handler event="click" type="application/xml">
<e:choose>
<e:when test="id('myCheckbox')/property::selected">
<c:alert select="'selected'" />
</e:when>
<e:otherwise>
<c:alert select="'not selected'" />
</e:otherwise>
</e:choose>
</e:handler>
</b:checkBoxGroupOption>
</b:checkBoxGroup>
<b:checkBoxGroupOption id="myCheckbox">
<span>My Checkbox</span>
<e:handler event="click" type="application/xml">
<e:choose>
<e:when test="id('myCheckbox')/property::selected">
<c:alert select="'selected'" />
</e:when>
<e:otherwise>
<c:alert select="'not selected'" />
</e:otherwise>
</e:choose>
</e:handler>
</b:checkBoxGroupOption>
</b:checkBoxGroup>
Inspecting the view, I see that the label is not correctly associated to the input.
<span id="myCheckbox" xmlns="http://www.w3.org/1999/xhtml">
<input type="checkbox" />
<label>
<span>My Checkbox</span>
</label>
</span>
<input type="checkbox" />
<label>
<span>My Checkbox</span>
</label>
</span>
Either adding the "for" attribute to the label element, or only applying the event listener to the input element (as opposed to the entire parent span element) would fix this.
click event on checkBoxGroupOption
18 March, 2008 - 13:13 — yudiHi tordona,
The label also get click event because In the view space the id is in span element and label is inside/a child of span element. In this case, then you can use change event instead of click event. The change event only be fired if the value of the checkBoxGroup has been changed.
Cheers,
Yudi
Not documented
18 March, 2008 - 16:44 — tordonaChange event being available for checkBoxGroupOption is not documented. I would tested it had I read it.
I still feel that the label element should be properly associated to the checkbox input, else it serves no purpose to be included other then to try and be semantically correct.
A simple rearrangement of the starting label element would do.
<label>
<input type="checkbox" />
<span>My Checkbox</span>
</label>
</span>
click event on checkBoxGroupOption
19 March, 2008 - 12:24 — yudiHi tordona,
That's right that change event is not in the reference. I consider this as a bug in documentation. I 'll put this in our issue tracking system to be fixed.
You said that the label element should be properly associated to the checkbox input. So ,I think you would like the check box is also checked if the user click on the check box's label. I'll add this as a BTL feature request.
Cheers,
Yudi
Yes
19 March, 2008 - 18:58 — tordonaYes, that's correct. Thank you for your help.