[Resolvido] Adicionar div não funciona!

[Ricardo Bortolotti 0]

Bom dia galera \o

 

Estou eu aqui, recorrendo aos magos de plantão, preciso de uma ajuda urgente.

Vamos lá.

Eu tenho formulario criado dinamicamente por um botão em js, até ai tudo bem esta funcionando perfeitamente, porem...

No Firefox 3.6.13 e Chrome, quando eu preencho o formulario e clico em adicionar, ele limpa o formulario de cima.

Segue o codigo para melhor compreensão...

 

function adicionaItem(divName) {
var iCount = document.getElementById('numeroItem').value;

var campo = "<div id='linha_"+iCount+"'><b>Item "+iCount+"</b>";
campo += "<table>";
campo += "<tr><td width='30%'>Código:</td><td><input type='text' name='codigoItem["+iCount+"]' value='' maxlength='11' size='11'></td>";
campo += "<td width='30%'>CFOP: </td><td><input type='text' name='cfop["+iCount+"]' value=''  maxlength='4' size='4' onKeyPress='return numbersOnly(this, event)'></td></tr>";
campo += "<tr><td width='30%'>Quantidade: </td><td><input type='text' name='quantidade["+iCount+"]' value='' class='alinhaValor' maxlength='16' size='16' onKeyDown='FormataValor(this, 12, event);'></td>";
campo += "<td width='30%'>Valor Unitário:</td><td> <input type='text' name='valorUnit["+iCount+"]' value='' class='alinhaValor' maxlength='16' size='16' onKeyDown='FormataValor(this, 12, event);'></td></tr>";
campo += "<tr><td width='30%'>Valor Desconto:</td><td> <input type='text' name='valorDesc["+iCount+"]' value='' class='alinhaValor' maxlength='16' size='16' onKeyDown='FormataValor(this, 12, event);'></td></tr>";
campo += "<td width='30%'>Base de Cálculo ICMS (R$): </td><td><input type='text' name='baseIcmsItem["+iCount+"]' value='' class='alinhaValor' maxlength='16' size='16' onKeyDown='FormataValor(this, 12, event);' ></td>";
campo += "<td width='30%'>Alíquota ICMS (%):</td><td> <input type='text' name='aliquota["+iCount+"]' value='' class='alinhaValor' maxlength='5' size='5' onKeyDown='FormataValor(this, 4, event);'></td>";
campo += "</table><br></div>";

var camposTexto = document.getElementById(divName); 

   camposTexto.innerHTML = camposTexto.innerHTML+campo;

   iCount++;
   document.getElementById('numeroItem').value = iCount;
}

 

Como isso são campos de itens em notas fiscais, não posso limpar quando o usuario clicar em adicionar, alguem pode me ajudar??

 

Desde já obrigado!

[Francis Schiavo 1]

Adicionar novas tags por innerHTML costuma funcionar, porém em alguns casos isso não funciona.

Você poderia tentar adicionar as novas tags de forma mais estruturada, criando as tags e adionando-as individualmente.

 

Olhe o exemplo que coloquei no meu post aqui que poderá ser útil.

[Ricardo Bortolotti 0]

Galera, o problema é o seguinte.

O InnerHTML limpa os dados que estavam preenchidos nos campos adicionados anteriormente.

No IE 9 não limpa!

Alguem tem alguma ideia?

[William Bruno 1501]

use um appendChild em vez de usar .innerHTML.

 

pois com o innerHTML, você reescreve o conteudo novamente. Se você so precisa adicionar, então o append.. é oque você deve usar.

[Ricardo Bortolotti 0]

Bom dia Galera!

 

RESOLVIDO

 

Muito obrigado William Bruno, eu já estava estudando isso, mas com sua enfase, eu dei maior importancia ao assunto! :D

 

Segue o codigo para quem precisar!

 

function adicionaEquipamento(divName) {
var iCount = document.getElementById('numeroEquipamento').value;

var newDiv = document.createElement("div");
newDiv.setAttribute('id','linha_'+iCount);

var campo = "<b>Equipamento "+iCount+"</b><table>";

campo += "<tr><td width='30%'>Nome:</td><td><input type='text' readonly id='nomeEquipamento["+iCount+"]' name='nomeEquipamento["+iCount+"]' size='40' style='border: 0px;' title='Utilize o botão Pesquisar Equipamento'></td>";
campo += "<input type='hidden' id='idEquipamento["+iCount+"]' name='idEquipamento["+iCount+"]'/>";
campo += "<td><input type='button' value='Pesquisar' onclick='pesquisarEquipamento("+iCount+");' title='Pesquisar Equipamento' /></td></tr>";
campo += "<tr><td width='30%'>Quantidade: </td><td colspan='2'><input type='text' name='quantidade["+iCount+"]' value='' class='alinhaValor' maxlength='16' size='16'>";
campo += "</table><br></div>";
var camposTexto = document.getElementById(divName); 

newDiv.innerHTML = campo;
camposTexto.appendChild(newDiv);

   iCount++;
   document.getElementById('numeroEquipamento').value = iCount;
}