Monday, 12 August 2013

Clickable Label for Checkbox GWT

Clickable Label for Checkbox GWT

In HTML this is quite easy
<input type="checkbox" name="checkbox" id="checkbox_id" value="value" />
<label for="checkbox_id">Text</label>
[Code from] How to create an HTML checkbox with a clickable label
Not sure how it's done in GWT
My issue is I'm not sure how to replicate this in GWT with their native
checkbox. This is a snippet from my ui.xml file inside an <HTMLPanel>
<table>
<tr>
<td align="right" ui:field="defaultCheckBoxText">Checkbox Label</td>
<td><g:CheckBox ui:field="defaultCheckBox"/></td>
</tr>
</table>
The way the layout is, I need to keep with the table so I can't use the
label around the input technique. I mean, I can, but I would prefer to
know how to do it the other way.



I've tried this, but it didn't work
The reason being, in the compiled GWT code, the actual ID of the element
is gwt-uid-1118. I could change the label to <label for="gwt-uid-1118">,
but that is not a good idea since they are dynamically generated.
<table>
<tr>
<td align="right" ui:field="defaultCheckBoxText"><label
for="defaultCheckBox">Checkbox Label</label></td>
<td><g:CheckBox ui:field="defaultCheckBox"/></td>
</tr>
</table>



TL;DR
Anybody know how a clickable label (separate from the CheckBox) in GWT is
done in the ui.xml file?

No comments:

Post a Comment