Dojo: Programatically setting checkbox label for a

Question

after some hours of checking out documentation, I am somewhat desperate: Basically I need to populate a TabContainer with some TextBoxes, and some Checkboxes. All theses neatly arranged: Labels to the left, fields to the right.
To have this done I use a TableContainer that I add to the TabContainer, create the TextFields and add them to the TableContainer. All is rendered ok. But when it comes to a checkbox, I can't find the trick to have a label displayed at all. If I: - add a label-attribute to creation statement say:
var text8 = new dijit.form.CheckBox({
id:"zuschauer_" + i, value: "zuschauer", label:"fritt"});
Firefox comes up with a "containerNode is null" - Error

• try to add a tag: Nothing is shown (no error, but alas: no label):
  var text9 = dojo.create('<label>');
  dojo.attr(text9,"for","zuschauer_" + i);
  dojo.attr(text9,"content","fritt");

• try to add a div or somewhat else on the tablecontainer (disabled Labels): Firefox comes up whith: Error: uncaught exception: [Exception... "Component returned failure code: 0x80004003 (NS_ERROR_INVALID_POINTER) [nsIDOMHTMLDivElement.appendChild]" nsresult: "0x80004003 (NS_ERROR_INVALID_POINTER)" location: "JS frame :: ...

• same is for created TextNodes...

So how the hack:
- Would I generate a label to a checkbox programatically (no html template possible, I've seen the code around, creating a checkbox but having a 'label for' on the html before. This would not be helpful, as I don't know how many checkboxes I need at designtime. These are to be genereated completly at runtime.
- Would I have this very simple design done programatically, Must be easy, this is not rocket sience. Do I really need the TableContainer to have this done?

• Can I create static text in a TableContainer?

Answer 1

I would suggest creating an HTML string then setting it as content of a ContentPane. If you need to build the form programatically, you might make your own widget that extends ContentPane and takes the data as you get it, and generates the right innerHTML. That' going to end up being simpler than trying to cobble this together out of existing widgets.

Answer 2

In such cases you may want to use the input/widget inside an anonimous LABEL (HTML) tag. You can put the text before or after the input/widget, and probably position it using style/dir attributes. This will allow some more flexibility, as you don't need an ID at parse time. Just create a label tag and throw in your form widget. It is pure HTML and should be supported since HTML 4.01.

http://www.w3.org/TR/html401/interact/forms.html#h-17.9

See also: Making checkbox and radio labels clickable