Add date in table

Asked

Viewed 128 times

0

I’m pulling an API and putting its data inside a table, but this data goes to the table part that is td, but I want to put the date that the data were implemented there, then the date would be in th.

Currently my code is like this:

<div class="container">
    <div class="table-responsive">
        <table class="table" width="100px" align="center">
            <thead>
                <tr class="cliente">
                      <th class="cor">Quantidade</th>

                </tr>
                <tr class="clientess">
                      <th class="cor">Nº.Pedido</th>


                </tr>
                <tr class="fiscal">
                      <th class="cor">Nota Fiscal</th>

                </tr>
                <tr class="entprevista">
                      <th class="cor">Entrega Prevista</th>

                </tr>

                <tr class="data">
                  <th class="cor">Data</th>


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

PULLING API

    function load() {

  var xhr = new XMLHttpRequest();

  xhr.open("GET", "API AQUI");

  xhr.addEventListener("load", function() {
      var resposta = xhr.responseText;
      console.log("ola1");
      var clientes = JSON.parse(resposta);
      console.log("ola2");
      console.log(clientes);

      for (var i =0; i < 1; i++){
          console.log("ola3");
         var clientes_1 = clientes.TRACKER[i];
         adicionaClienteNaTabelaViagem(clientes_1);
         adicionaClienteNaTabelaViagemLogo(clientes_1);
         AdicionaNotaFiscal(clientes_1);
         AdicionaEntPrevista(clientes_1);
         AdicionaStatus(clientes_1);
     }

  });

  xhr.send();
      }
      window.onload = load;

SOME DATA I PUT IN THE TABLE TD

function AdicionaNotaFiscal(fiscal) {

    var notaTr = fiscalTr(fiscal);
    var tabelas = document.querySelector(".fiscal");


    tabelas.appendChild(notaTr);

}

function fiscalTr(fiscal) {
    var notaTr = document.createElement("tr");
    notaTr.classList.add("fiscal");

      notaTr.appendChild(notaTd(fiscal.NFISCA, "info-nota-fiscal"));

    return notaTr;
}

function notaTd(dado, classe) {

    var teste = document.querySelector(".fiscal");

    var td = document.createElement("td");
    td.classList.add(classe);
    td.textContent = dado;

    return td;
}

There on th that written "quantity", "invoice"... I wanted it to be the date of the day that I posted the api

  • already tried with input? Input type = DateTime-Local

  • No. That would be inside th?

  • excuse read your wrong question, you want the system to run automatically right? I thought it was pro user to select the date and time

  • will have to be a .js to do this routine

  • Exactly. Then I can’t do it

  • look at this example here see if you can insert it in your code (https://temptable.com.br/2015/11/display-data-e-hora-actual-em-html.html)

  • I’ve tried this one, it’s not the way I want it

  • I found a very simple code here and very efficient var teste = new Date()&#xA;document.write(teste.toLocaleString());

  • True. The only problem is how do I put this to the HTML table there

Show 4 more comments

1 answer

0


Already managed to solve the problem. A colleague of the site helped:

function addColunaData(data){
  var tabela   = document.getElementsByClassName("table")[0];
  //Pego a primeira coluna da primeira linha da tabela de classe table.
  var primeiraColuna = tabela.rows[0].cells[0];

  //concateno a data ao valor da primeira coluna.
  primeiraColuna.append(' ' + data);

}


//Abaixo sua forma de criar a data
var data = new Date();
var dia  = data.getDate();
var mes  = data.getMonth();
var ano  = data.getFullYear();
var hora = data.getHours();
var min  = data.getMinutes();
var seg  = data.getSeconds();
var str_data = dia + '/' + (mes+1) + '/' + ano;
var str_hora = hora + ':' + min;

//Concateno as variaves em uma única para realizar a atribuição
var data = str_data + ' ' + str_hora;

//Chamo a função para adicionar a data criada acima na coluna.
addColunaData(data);

Browser other questions tagged

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