Adicionar Input dinamicamente

joaofilho_21 · Junho 27, 2015

Olá, Tenho uma duvida e acredito que alguém possa me ajudar.

Em um projeto que estou desenvolvendo, crio um portal em PHP com banco de dados SQL. toda a integração dos dados adicionados no PHP são colocados no SQL sem problemas. Meu problema começo quando resolvi colocar campos adicionados dinamicamente, onde de inicio uma tabela contem 7 campos com input. e adicionei um botão para adicionar mais linhas. Segue o codigo para verificação.

<script LANGUAGE="JavaScript">
    totals =0;
    function adiciona(){
    totals++
        tbl = document.getElementById("tabela")
 
        var novaLinha = tbl.insertRow(-1);
        var novaCelula;
 
        if(totals%2==0) cl = "#F5E9EC";
        else cl = "#FBF6F7";
 
        novaCelula = novaLinha.insertCell(0);
 
        novaCelula.style.backgroundColor = cl
 
        novaCelula.innerHTML = "<input id='descricaoItem[]' type='text'  class='span12' name='descricaoItem' value='' />";
 
        novaCelula = novaLinha.insertCell(1);
        novaCelula.align = "left";
        novaCelula.style.backgroundColor = cl;
        novaCelula.innerHTML = "<input id='descricaoCodigo' type='text'  class='span12' name='descricaoCodigo' value='' />";
 
        novaCelula = novaLinha.insertCell(2);
        novaCelula.align = "left";
        novaCelula.style.backgroundColor = cl;
        novaCelula.innerHTML = "<input id='descricaoServico' type='text'  class='span12' name='descricaoServico' value='' />";
 
        novaCelula = novaLinha.insertCell(3);
        novaCelula.align = "left";
        novaCelula.style.backgroundColor =cl;
        novaCelula.innerHTML = "<input id='descricaoUni' type='text'  class='span12' name='descricaoUni' value='' />";
		
		novaCelula = novaLinha.insertCell(4);
        novaCelula.align = "left";
        novaCelula.style.backgroundColor =cl;
        novaCelula.innerHTML = "<input id='descricaoQuant' type='text'  class='span12' name='descricaoQuant' value='' />";
		
		novaCelula = novaLinha.insertCell(5);
        novaCelula.align = "left";
        novaCelula.style.backgroundColor =cl;
        novaCelula.innerHTML = "<input id='descricaoPreco' type='text'  class='span12' name='descricaoPreco' value='' />";
		
		novaCelula = novaLinha.insertCell(6);
        novaCelula.align = "left";
        novaCelula.style.backgroundColor =cl;
        novaCelula.innerHTML = "<input id='descricaoPrecototal' type='text'  class='span12' name='descricaoPrecototal' value='' />";
		
    }
    </script>
</head>
<body><div style="padding: 1%; margin-left: 0">

                                        <div>
    <table id='tabela' border='0'>
        <tr style='background-color:#FBF6F7'>
            <td>Item </td>
            <td>Código</td>
            <td>Especificação do Serviço</td>
            <td>UNI</td>
            <td>QUANT</td>
            <td>P. UNI.</td>
            <td>Preço Total</td>
        </tr>
        <tr style='background-color:#FBF6F7'>
            <td><input id='descricaoItem' type='text' class='span12' name='descricaoItem' value='' /></td>
            <td><input id='descricaoCodigo' type='text' class='span12' name='descricaoCodigo' value='' /></td>
            <td><input id='descricaoServico' type='text' class='span12' name='descricaoServico' value='' /></td>
            <td><input id='descricaoUni' type='text' class='span12' name='descricaoUni' value='' /></td>
            <td><input id='descricaoQuant' type='text' class='span12' name='descricaoQuant' value='' /></td>
            <td><input id='descricaoPreco' type='text' class='span12' name='descricaoPreco' value='' /></td>
            <td><input id='descricaoPrecototal' type='text' class='span12' name='descricaoPrecototal' value='' /></td>
        </tr>
    </table></div></div><input type='button' id='incluir' value='incluir' onclick='adiciona()'/>
<br />      
</div>
</div>
</div>

O codigo esta do jeito que imaginava, mas o problema é que, quando adiciono mais uma linha e acrescento os dados na hora de salvar no banco de dados sempre salva somente a ultima linha. e os primeiros dados ficam perdido.

Agradeço a ajuda !

wootzor · Junho 30, 2015

Atenção que o código JavaScript tem alguns erros de sintaxe (falta declarar a variável totals e falta um ponto-e-vírgula no final de duas expressões, nas linhas 5 e 12). Fazendo essas alterações tudo parece funcionar conforme se pretende.

Podes colocar o excerto de código PHP?

Entrar

Adicionar Input dinamicamente

Pergunta

joaofilho_21

Link para o comentário

Compartilhar em outros sites

1 resposta a esta questão

Posts Recomendados

wootzor

Link para o comentário

Compartilhar em outros sites

Participe da discussão

Estatísticas dos Fóruns

Navegação

Atividades