1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124
| function test(titre, keyword, version) {
var contenu = "Titre: " + titre + "\nKeyword:" + keyword + "\nVersion: " + version;
console.log(contenu);
}
function addTable(tabTitre, tabDateCrea, tabDateRevis, tabResume, tabUrlKeyword, tabUrlVersion) {
var myTableDiv = document.getElementById("wms"); //je récupère la div dans laquelle je vais mettre mon tableau
var table = document.createElement('TABLE'); //je crée la balise table
var tabHeader = ["Titre", "Date de Création", "Date de Révision", "Résumé", "Keyword", "Version", "Ajout Couche"]; //tableau des en-tête
table.border = '1'; //je lui applique une bordure sur toute la table
myTableDiv.className = "table table-responsive"; //je lui applique la class paleBlueRows du css
table.id = "paleBlueRows";
table.className = "datatable table table-striped table-bordered";
//création de la balise thead et tr qui va contenir l'en-tête de chaque colonne
var thead = document.createElement('THEAD');
var trTitle = document.createElement('TR');
thead.appendChild(trTitle);
table.appendChild(thead);
//remplissage des balises th du tableau
for (var i = 0; i < tabHeader.length; i++) {
var th = document.createElement('TH');
th.appendChild(document.createTextNode(tabHeader[i])); //je mets dans les balises th le contenu du tableau d'en-tête
trTitle.appendChild(th);
}
var tableBody = document.createElement('TBODY'); //création de l'élément body de la de table
tableBody.width = '100%'; //le tableau va prendre toute la largeur de la div
tableBody.id = "wmsTable";
table.appendChild(tableBody);//j'ajoute l'élément tbody dans table
//remplissage des colonnes
for (var j = 0; j < tabDateCrea.length; j++) {
//création des colonnes
var tr = document.createElement('TR');
var td = document.createElement('TD');
td.id = "titre";
td.appendChild(document.createTextNode(tabTitre[j]));
tr.appendChild(td);
var td2 = document.createElement('TD');
td2.id = "dateCrea";
td2.appendChild(document.createTextNode(tabDateCrea[j]));
tr.appendChild(td2);
var td3 = document.createElement('TD');
td3.id = "dateRevis";
td3.appendChild(document.createTextNode(tabDateRevis[j]));
tr.appendChild(td3);
var td4 = document.createElement('TD');
td4.id = "resume";
td4.appendChild(document.createTextNode(tabResume[j]));
tr.appendChild(td4);
var td5 = document.createElement('TD');
td5.id = "keyword";
td5.appendChild(document.createTextNode(tabUrlKeyword[j]));
tr.appendChild(td5);
var td6 = document.createElement('TD');
td6.id = "version";
td6.appendChild(document.createTextNode(tabUrlVersion[j]));
tr.appendChild(td6);
var tdButton = document.createElement('TD');
tdButton.id = "couche";
var button = document.createElement('button');
button.type = "button";
button.id = "btnAdd" + j;
button.className = "btn btn-default btn-sm";
var span = document.createElement('span');
span.id = "plus";
span.className = "glyphicon glyphicon-plus";
button.onclick = function() {
var indice = $(this).index();
var trRow = tableBody.getElementsByTagName("tr")[indice];
console.log(trRow);
var mycelTitre = trRow.getElementsByTagName("td")[0].innerHTML; //récupère la collone des titres
var mycelKeyword = trRow.getElementsByTagName("td")[4].innerHTML; //récupère la colonne des keywords
var mycelVersion = trRow.getElementsByTagName("td")[5].innerHTML; //récupère la collone des versions
test(mycelTitre, mycelKeyword, mycelVersion)
};
button.appendChild(span);
tdButton.appendChild(button);
tr.appendChild(tdButton);
//on les cache car on ne veut pas les afficher mais on besoin de leur contenu
$(td5).toggle(); //cache la colonne keyword
$(td6).toggle(); //cache la colonne version
tableBody.appendChild(tr);
}
myTableDiv.appendChild(table);
var row = table.rows;
var keyword = row[0].cells[4]; //récupère la cellule de la colonne Keyword
var version = row[0].cells[5]; //récupère la cellule de la colonne version
//on les cache car on ne veut pas les afficher mais on a besoin du contenu
$(version).toggle(); //cache l'en-tête version
$(keyword).toggle(); //cache l'en-tête keyword
} |
Partager