1

Galera boa tarde, estou desenvolvendo meu TCC, preciso criar uma Pagina chamada doações, nesta pagina o usuário pode doar mais de um item, eu consegui criar um botão Adicionar onde ele insere linhas numa tabela html,então toda vez que ele digitar um item no input e clicar no adicionar ele insere o valor do input numa nova linha na tabela. porém não consigo pegar os valores para salvar no database.

Javascript

< script LANGUAGE = "JavaScript" >
  geral = 0;

function btn_add() {
  geral++
  tabelinha = document.getElementById("tabela")
  var especie1 = document.getElementById("especie");
  var qtde1 = document.getElementById("qtde");
  var novaLinha = tabelinha.insertRow(-1);
  var novaCelula;
  if (geral % 2 == 0)
    cortabela = "FFF5EE";
  else
    cortabela = "FFFAF0";

  novaCelula = novaLinha.insertCell(0);
  novaCelula.style.backgroundColor = cortabela;
  novaCelula.innerHTML = especie1.value;

  novaCelula = novaLinha.insertCell(1);
  novaCelula.style.backgroundColor = cortabela;
  novaCelula.innerHTML = qtde1.value;

  novaCelula = novaLinha.insertCell(2);
  novaCelula.style.backgroundColor = cortabela;
  novaCelula.innerHTML = '<input type="button" class="btn btn-danger" value="X" onclick="deleteRow(this)"/>';


}

function deleteRow(btn) {
  var row = btn.parentNode.parentNode;
  row.parentNode.removeChild(row);
}

function btn_save() {
  var resposta = confirm("Deseja salvar o registro?");

  if (resposta === true) {


  }

}

<
/script>
<div class="container">
  <h1 style="font-weight: bold;">Doações</h1>
  <hr>
  <div class="container">
    <div class="form-inline">
      <div class="form-group">
        <label for="cliente">Cliente:</label>
        <input type="text" class="form-control" id="cliente" name="cliente">
      </div>
      <div class="form-group">
        <label for="data"></label>
        <input type="date" class="form-control" id="data" name="data">
      </div>
    </div>
    <br>
    <div class="form-inline">
      <div class="form-group">
        <label class="" for="especie">Especie:</label>
        <input type="text" name="especie" id="especie" class="form-control">
      </div>
      <div class="form-group">
        <label class="" for="qtde">Qtde:</label>
        <input type="text" name="qtde" id="qtde" class="form-control">
      </div>
      <div class="form-group">
        <label class="" for="local">Local:</label>
        <input type="text" name="local" id="qtde" class="form-control">
        <input class="btn btn-success" type='button' id='incluir' value='incluir' onclick='btn_add();' />
      </div>
    </div>
  </div>
</div>


<div class="container">
  <table id='tabela' class="table table-hover table-responsive">
    <tr>
      <td>Espécie</td>
      <td>Qtde</td>
      <td>Excluir</td>
    </tr>
  </table>
</div>

<div class="container">
  <div class="form-group form-inline">
    <label class="control-label col-sm-12"></label>
    <div class="col-sm-3">
      <input class="btn btn-warning" type='button' id='salvar' value='Salvar' onclick="btn_save();" />
    </div>
  </div>
</div>

inserir a descrição da imagem aqui

No caso ele teria que apertar o botão salvar onde guardaria o valor de todos inputs e os itens da tabela html no banco de dados.

1 Resposta 1

0

Acho que devias manter uma referência desses valores que adicionas em variáveis... mas podes claro fazer uma tabela e ler daí o valor. Um exemplo seria:

const tabela = document.getElementById('tabela');
const rows = [...tabela.querySelectorAll('tr')]
  .slice(1) // o slice é para remover a primeira linha com os labels
  .map(el => [...el.children].map(el => el.textContent));

const data = rows.reduce((arr, [tipo, valor]) => arr.concat({
  tipo,
  valor
}), []);

console.log(JSON.stringify(data, null, 4));
<table id='tabela' class="table table-hover table-responsive">
  <tr>
    <td>Espécie</td>
    <td>Qtde</td>
    <td>Excluir</td>
  </tr>
  <tr>
    <td>X</td>
    <td>150</td>
    <td>Excluir</td>
  </tr>
  <tr>
    <td>Y</td>
    <td>250</td>
    <td>Excluir</td>
  </tr>
</table>

6
  • O codigo acima cria um objeto Json e mostra pelo console certo? Ainda assim não consegui capturar os dados para armazenar no Banco de dados. :( Commented 19/05/2019 às 2:10
  • @WanclaFelipe o código funciona até ao console? e o que queres saber é como gravar na base de dados?
    – Sergio
    Commented 19/05/2019 às 6:39
  • Sim, funciona ele joga o objeto no console.log.. Mas não consigo pegar os valores pra armazenar no banco. Commented 20/05/2019 às 20:13
  • @WanclaFelipe então parece-me que o que perguntas-te na pergunta está resolvido com a minha resposta. Agora falta por a funcionar a parte que envia os dados para o servidor e grava na base de dados, correto?
    – Sergio
    Commented 20/05/2019 às 20:24
  • Não, eu falei lá em cima que eu não estava conseguindo pegar os valores pra armazenar no banco de dados. E ainda continuo sem saber =/ Commented 22/05/2019 às 16:24

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .