Add Account in Array and View information in a Table

Question

Can you help me with a code? I need you to enter information in two Array through two different messages prompt whenever the "Add Account" button is triggered and, as soon as the "Show Accounts" button is triggered, show all accounts in a table with the account number (nCad), name and value in the account. My code doesn’t work the way I’d like it to.

var nomeA = new array[''];
var account = new array[''];
var nCad = new array[''];
var cadastro = 0;

function addAccount(){
  cadastro++;
  nomeA.push = prompt("Nome: ");
  account.push = prompt("Conta: ");
  nCad.push = cadastro;
}

function showAccounts(){
info.innerHTML("<table>");

for(x=0; x=cadastro; x++){
  info.innerHTML("<tr>");
  info.innerHTML("<td>" + nCad[x] + "</td>");
  info.innerHTML("<td>" + nomeA[x] + "</td>");
  info.innerHTML("<td>" + account[x] + "</td>");
  info.innerHTML("</tr>");
info.innerHTML("</table>");
}

td{
  border: 1px solid grey;
}

<button onclick="addAccount()">Adicionar Conta</button>
<button onclick="showAccounts()">Mostrar Contas</button>
<div id="info"></div>

Answer 1

const clients = [];
const account = [];

function addAccount(){
   clients.push({
   name: prompt("Nome: "),
   account: prompt("Conta: ")
 });
}

function showAccounts(){
   info.innerHTML = '<table>';

   for(x=0; x=clients.length; x++){
      info.innerHTML = '<td>' + clientes.lenght +'<td>';
      info.innerHTML = '<td>' + name[x] + '</td>';
      info.innerHTML = '<td>' + account[x] + '</td>';
      info.innerHTML = '</tr>';
   }
   info.innerHTML = '</table>';
}

Answer 2

You have some errors in your code:

• missing a } in function showAccounts

• to insert HTML you must use .innerHTML = 'string', and not .innerHTML('string'), That would be more like jQuery

• to insert elements in an array you must use .push(elemento), and not .push = elemento

I redid your code, removed the nCad and cadastro as having an array you always know its .length or the number of elements. In the case of my example through the reduce.

const info = document.getElementById('info');

const clients = [];
const account = [];

function addAccount() {
  clients.push({
    name: prompt("Nome: "),
    account: prompt("Conta: ")
  });
}

function showAccounts() {
  const rows = clients.reduce((html, client, i) => {
    return `
      <tr>
        <td>${i+1}</td>
        <td>${client.name}</td>
        <td>${client.account}</td>
      </tr>
    `;
  }, '');
  info.innerHTML = `<table>${rows}</table>`;
}

td {
  border: 1px solid grey;
}

<button onclick="addAccount()">Adicionar Conta</button>
<button onclick="showAccounts()">Mostrar Contas</button>
<div id="info"></div>