Search code examples
xulxulrunner

Dynamically Created LABEL Element not showing up in XUL application


I'm trying to dynamically create a set of labels in my XUL Runner application. I have an HBox like so:

<hbox class="upload-attachments"></hbox>

If I manually assign a label element to it like so:

<hbox class="upload-attachments"><label value="test" /></hbox>

It works fine. Also, when I query the object in Javascript I can access the test label.

When I try and create new label elements programmatically it fails. This is roughly what I am doing:

var attachments = view.query_first('.upload-attachments');
var label = view.ownerDocument.createElement('label');
label.value = "Some value."
attachments.appendChild(label);
var childCount = attachments.childNodes.length;

The query_first method is just a call to the Sly Query Selector engine and in other cases works fine. The childCount value is updating appropriately, and as I said, I can access and manipulate any labels I manually add to the hbox.

Thanks in advance,


Solution

  • Either append it with the attribute set, or set the property after inserting:

    var label = view.ownerDocument.createElement('label');
    attachments.appendChild(label);
    label.value = "Some value."
    

    -- or --

    var label = view.ownerDocument.createElement('label');
    label.setAttribute("value", "Some value.");
    attachments.appendChild(label);
    

    The reasoning being that, before the element was inserted, the property setters don't work.