Hi,

I want to create a custom table from a query component that has a kettle transformation data source.

I'm getting the data only with the bellow code, but I don't know how to get the headers.

Code:
function() {
    var myContainer = document.getElementById('panel_body_user_aggregates');
    var myTable = document.createElement('table');
    var myTHead = document.createElement('thead');
    var myTh = document.createElement('th');
    var myTBody = document.createElement('tbody');
    var myTr = document.createElement('tr');
    var myTd = document.createElement('td');
    //var q = dashboard.getQuery('query_user_aggregates');
    var var_result_user_aggregates = dashboard.getParameterValue('result_user_aggregates');
    
    myTable.className = 'table table-striped table-bordered';
    
    myTr.innerHTML = "<th></th><th colspan='2'>Latenza Media</th><th colspan='2'>Latenza Media</th><th colspan='3'>Through. Download Medio</th>";
    document.getElementById('panel_body_user_aggregates').innerHTML='';
    
    myContainer.appendChild(myTable).appendChild(myTBody);
    //myContainer.innerHTML('');     
    myContainer.lastChild.lastChild.appendChild(myTr);
    for(var i = 0; i < var_result_user_aggregates.length; i++) {        
        myContainer.lastChild.lastChild.appendChild(myTr.cloneNode());
        for(var j = 0; j < var_result_user_aggregates[i].length; j++) {
            myText = document.createTextNode(var_result_user_aggregates[i][j]);
            myContainer.lastChild.lastChild.lastChild.appendChild(myTd.cloneNode()).appendChild(myText);
        }
    }
}
I followed an old post
Code:
https://diethardsteiner.github.io/dashboards/2014/05/21/Pentaho-CDE-Custom-Table.html
It has the following code but it doesn't work in version 8, only the metadata part.
Code:
function() {
       var myContainer = document.getElementById('test');
       var myTable = document.createElement('table');
       var myTHead = document.createElement('thead');
       var myTh = document.createElement('th');
       var myTBody = document.createElement('tbody');
       var myTr = document.createElement('tr');
       var myTd = document.createElement('td');
       
       //myTable.id = 'table1';
       myTable.className = 'table table-striped';
       
       //document.getElementById('test').innerHTML = JSON.stringify(this.metadata);
       myMetadata = this.metadata;
          
       myContainer.appendChild(myTable).appendChild(myTHead).appendChild(myTr);
       
       for(var s = 0; s < myMetadata.length; s++){
           myHeaderText = document.createTextNode(myMetadata[s]['colName']);
           myContainer.lastChild.lastChild.lastChild.appendChild(myTh.cloneNode()).appendChild(myHeaderText);
       }
        
       myContainer.lastChild.appendChild(myTBody);
           
       for(var i = 0; i < select_result.length; i++) {
           myContainer.lastChild.lastChild.appendChild(myTr.cloneNode());
           for(var j = 0; j < select_result[i].length; j++) {
               myText = document.createTextNode(select_result[i][j]);
               myContainer.lastChild.lastChild.lastChild.appendChild(myTd.cloneNode()).appendChild(myText);
           }
       }

   }
Can someone help me or point me to another direction...please!