créer case à cocher dynamiquement en utilisant JavaScript DOM XUL

Question

Je veux créer case à cocher dynamiquement en utilisant JavaScript DOM XUL pour les valeurs d'arbres: Cette fonction est utilisée pour obtenir les valeurs de mon arbre XUL:

function choose() { 
    var tree = document.getElementById('myTodoListTree'); 
    for (var i = 0; i < tree.view.rowCount; i++) { 
    if (tree.view.getCellValue(i, tree.columns.getColumnAt(0)) == 'true'){ 
     alert(
     tree.view.getCellText(i, tree.columns.getNamedColumn("name"))+"\n"+ 
     tree.view.getCellText(i, tree.columns.getNamedColumn("lastname"))+"\n"+ 
     tree.view.getCellText(i, tree.columns.getNamedColumn("gmail"))+"\n"+ 
     tree.view.getCellText(i, tree.columns.getNamedColumn("yahoo"))+"\n"+ 
     tree.view.getCellText(i, tree.columns.getNamedColumn("url"))+"\n"+ 
     tree.view.getCellText(i, tree.columns.getNamedColumn("facebook-id")) 
    ); 
     var firstName= tree.view.getCellText(i, tree.columns.getNamedColumn("name")); 
     var lastName= tree.view.getCellText(i, tree.columns.getNamedColumn("lastname")); 
     var Gmail= tree.view.getCellText(i, tree.columns.getNamedColumn("gmail")); 
     var Yahoo= tree.view.getCellText(i, tree.columns.getNamedColumn("yahoo")); 
     var Facebook = tree.view.getCellText(i, tree.columns.getNamedColumn("url")); 
     var FacebookId = tree.view.getCellText(i, tree.columns.getNamedColumn("facebook-id")); 
    } 
    } 
    return arr;     
} 

Ce mybox, et je veux ajouter les créées dynamiquement GroupBox cases dans cette case:

Answer 1

Enfin, j'ai appris à créer des éléments dynamiquement.

Voici la solution: Ici j'ai créé dynamiquement une boîte de groupe, une légende et une case à cocher.

function choose() 
{ 
alert('hi'); 
    var tree = document.getElementById('myTodoListTree'); 
    for (var i = 0; i < tree.view.rowCount; i++) { 
    if (tree.view.getCellValue(i, tree.columns.getColumnAt(0)) == 'true'){ 

var empty = " "; 
var contact = (tree.view.getCellText(i, tree.columns.getNamedColumn("name"))+ empty+ 
tree.view.getCellText(i, tree.columns.getNamedColumn("lastname"))+ empty+ "Contacts:"); 

var ggmail = tree.view.getCellText(i, tree.columns.getNamedColumn("gmail")); 
var yyahoo = tree.view.getCellText(i, tree.columns.getNamedColumn("yahoo")); 

    var existingEl = document.getElementById('box'); 
    var capt = document.createElement('groupbox'); 
    existingEl.appendChild(capt); 
    var captionEl = document.createElement('caption'); 
    capt.appendChild(captionEl); 
    captionEl.setAttribute('label', contact); 
    captionEl.setAttribute('style', 'color: blue;'); 


    var existing = document.getElementById('box'); 
    var checkbox = document.createElement('checkbox'); 
    capt.appendChild(checkbox); 
    checkbox.setAttribute('label', ggmail); 
    checkbox.setAttribute("checked", "false") 
    checkbox.setAttribute('style', 'color: green;'); 

    var existing = document.getElementById('box'); 
    var checkbox = document.createElement('checkbox'); 
    capt.appendChild(checkbox); 
    checkbox.setAttribute('label', yyahoo); 
checkbox.setAttribute("checked", "false") 
    checkbox.setAttribute('style', 'color: green;'); 

    } 
    } 
    return arr; 

}