How to organize the values of an array in a table using Javascript

Asked

Viewed 55 times

-2

Hello, I have the following example array:

var users = [
    { DiaDaSemana: 'segunda a sexta', valor: 'joaozinho' },
    { DiaDaSemana: 'segunda a sexta', valor: 'mariazinha' },
    { DiaDaSemana: 'sabados', valor: 'manuel' },
    { DiaDaSemana: 'sabados', valor: 'jose' }
  ];

would like to know how to organize using table programmatically, with javascript in the following way:

segunda a sexta | sabados
joaozinho       | manuel
mariazinha      | jose

With this example I can not create neither a TH nor a TD plus lines:

<body>

    <div id='myDiv'>
        <table id='tabela'>
            <thead id="cabecalho">
                <tr id="linha">

                </tr>
            </thead>
        </table>
    </div>

    <script>
        var table = document.getElementById('tabela');
        var thead = document.getElementById('cabecalho');
        var tr = document.getElementById('linha');
        
        var textoInserido = [];
        // var existeLinha = false;

        var newCell = document.createElement('th');

        // Faz um loop para criar as colunas
        for (var j = 0; j < thead.rows.length; j++) {                   
        
                for (let indiceLinha = 0; indiceLinha < tr.cells.length; indiceLinha++) { 
                    
                    <% for (let i = 0; i < users.length; i++) { %>
                        
                        var existeLinha = tr.cells[indiceLinha].innerText.includes("<%= users[i].DiaDaSemana %>");
                        
                        if(existeLinha == false) {

                            newCell = tr.insertCell(<% i %>);
                            newCell.innerText = "<%= users[i].DiaDaSemana %>";

                            // insere o elemento na lista
                            textoInserido.push("<%= users[i].DiaDaSemana %>"); 

                        }

                    <% } %>           
                    
                }           

        }

        thead.appendChild(tr);

    </script>

I’m using the ejs to help build the table Could someone please shed some light on this?

javascript table

  • If you’ve tried N ways, then you have some code done, right? Please click [Edit] and add this code. Also read how to mount a [mcve]

  • @hkotsubo inserted the code snippet that does not work. OK ?

  • @Ediberto checks if my answer helps you

  • @clone where?

  • checks the post

1 answer

-2

function separador(users){

let temp={};
let newarray=[];
//inicia um foreache nos users
users.forEach(
        object => {
        //verifica se ja existe
        if(temp[object.DiaDaSemana] !== undefined){
            newarray.push(temp[object.DiaDaSemana]);
            temp= Object.assign(temp,{[object.DiaDaSemana]:[newarray]});
        }else{
            temp= Object.assign(temp,{[object.DiaDaSemana]:[object.valor]});
        }
    
})
    return temp;
}

let users = [
    { DiaDaSemana: 'segunda a sexta', valor: 'joaozinho' },
    { DiaDaSemana: 'sabados', valor: 'manuel' },
    { DiaDaSemana: 'segunda a sexta', valor: 'mariazinha' },
    { DiaDaSemana: 'sabados', valor: 'jose' }
  ];
  
console.log(separador(users));

Browser other questions tagged javascript table

You are not signed in. Login or sign up in order to post.