[Resolvido] Problemas com IE, string de array e remoção de campo

dinhotaswolf · Julho 1, 2011

Olá pessoal!

Estou com alguns problemas no código abaixo

<!--
// declaração de variáveis
var qtdeCampos = 0;

// função para o campo aceitar somente números
function Numero(e) {
	navegador = /msie/i.test(navigator.userAgent);
	if (navegador) {
		var tecla = event.keyCode;
	} else {
		var tecla = e.which;

		if (tecla > 47 && tecla < 58) { // numeros de 0 a 9
			return true;
		} else {
			if (tecla != 2 || tecla != 3 || tecla != 8 || tecla != 127) { // teclas home, end, backspace e delete
				return false;
			} else {
				return true;
			}
		}
	}
}		

/*
// função para atualizar valor do id
function atualizaN() {
	qtdeCampos = 0;
	$('.rows').each(function() {
		$(this).find('.nAtu').html(qtdeCampos);
		qtdeCampos += 1;
	});
}
*/

// função para adicionar campos ao formulário
function addCampos() {
	//atualizaN();

	if (qtdeCampos < 10 || qtdeCampos.value == "") {
		var objPai = document.getElementById("campoPai");
		//Criando o elemento DIV;
		var objFilho = document.createElement("div");
		//Definindo atributos ao objFilho:
		objFilho.setAttribute("id","filho"+qtdeCampos);

		//Inserindo o elemento no pai:
		objPai.appendChild(objFilho);
		//Escrevendo algo no filho recém-criado:
		document.getElementById("filho"+qtdeCampos).innerHTML = '<table class="rows" width="535" align="center" border="0"><tr><td width="70" bgcolor="#A9D9B1"><center><input type="text" size="5" name="tipo[]'+qtdeCampos+'" id="tipo'+qtdeCampos+'" /></center></td><td width="90" bgcolor="#A9D9B1"><center><input type="text" size="5" name="comp[]'+qtdeCampos+'" id="comp'+qtdeCampos+'" onkeypress="return Numero(event);" /></center></td><td width="90" bgcolor="#A9D9B1"><center><input type="text" size="5" name="larg[]'+qtdeCampos+'" id="larg'+qtdeCampos+'" onkeypress="return Numero(event);" /></center></td><td width="70" bgcolor="#A9D9B1"><center><input type="text" size="5" name="acab[]'+qtdeCampos+'" id="acab'+qtdeCampos+'" /></center></td><td width="70" bgcolor="#A9D9B1"><center><input type="text" size="5" name="qtd[]'+qtdeCampos+'" id="qtd'+qtdeCampos+'" onkeypress="return Numero(event);" /></center></td><td width="70" bgcolor="#A9D9B1"><center><select name="item[]'+qtdeCampos+'" id="item'+qtdeCampos+'"><option value="" selected>--------</option><option value="Peça">Peça</option><option value="Metro">Metro</option></select></center></td><td width="15" bgcolor="#A9D9B1"><center><input type="image" src="ico/x.gif" onclick="removerCampo('+qtdeCampos+')" title="Apagar produto"></center></td></tr></table>';
		// document.getElementById("filho"+qtdeCampos).innerHTML = '<table class="rows" width="535" align="center" border="0"><tr><td width="70" bgcolor="#A9D9B1"><center><input type="text" size="5" name="tipo[]'+qtdeCampos+'" id="tipo'+qtdeCampos+'" class="nAtu" /></center></td><td width="90" bgcolor="#A9D9B1"><center><input type="text" size="5" name="comp[]'+qtdeCampos+'" id="comp'+qtdeCampos+'" onkeypress="return Numero(event);" class="nAtu" /></center></td><td width="90" bgcolor="#A9D9B1"><center><input type="text" size="5" name="larg[]'+qtdeCampos+'" id="larg'+qtdeCampos+'" onkeypress="return Numero(event);" class="nAtu" /></center></td><td width="70" bgcolor="#A9D9B1"><center><input type="text" size="5" name="acab[]'+qtdeCampos+'" id="acab'+qtdeCampos+'" class="nAtu" /></center></td><td width="70" bgcolor="#A9D9B1"><center><input type="text" size="5" name="qtd[]'+qtdeCampos+'" id="qtd'+qtdeCampos+'" onkeypress="return Numero(event);" class="nAtu" /></center></td><td width="70" bgcolor="#A9D9B1"><center><select name="item[]'+qtdeCampos+'" id="item'+qtdeCampos+'" class="nAtu"><option value="" selected>--------</option><option value="Peça">Peça</option><option value="Metro">Metro</option></select></center></td><td width="15" bgcolor="#A9D9B1"><center><input type="image" src="ico/x.gif" onclick="removerCampo('+qtdeCampos+')" title="Apagar produto"></center></td></tr></table>';
		qtdeCampos++;
	}
}

// função para remover um campos do formulário
function removerCampo(id) {
	resposta = confirm("As informações serão excluidas permanentemente!\n\nDeseja prosseguir?")

	if (resposta == true) {
		var objPai = document.getElementById("campoPai");
		var objFilho = document.getElementById("filho"+id);

		//Removendo o DIV com id específico do nó-pai:
		var removido = objPai.removeChild(objFilho);
		qtdeCampos.value = conteudo.value.replace(id,);

		//qtdeCampos -= qtdeCampos;

		//atualizaN();
	}
}

// função para apagar todos os campos adicionados ao formulário
function removeTodosCampos() {
	resposta = confirm("As informações serão excluidas permanentemente!\n\nDeseja prosseguir?")

	if (resposta == true) {
		// procura a classe "rows" no código html da função addCampos() e remove
		$(".rows").remove();
		// retorna a quantidade de campos adicionados a 0
		qtdeCampos = 0;
		addCampos();
		return false;
	}
}

// função para verificar o navegador em utilização
/*
function verificaNav() {
	var browserName = navigator.appName;  

	if ( browserName == "Netscape" ) {  
		addCampos();
	} else if ( browserName == "Microsoft Internet Explorer" ) {  
		alert("Seu navegador não suporta essa ação./n/nPor favor preencha seu pedido no campo abaixo/n/nGrato pela compreenção!")  
	} else {  
		document.write("Coloque as funções de outros navegadores")
	}
}
*/
-->

Abaixo vou listar todas as dúvidas que possuo:

1 - O internet explorer não reconhece o código, (FireFox e Chrome funcionam normalmente), o que poderia ser feito;

2 - Gostaria de enviar dados para o email na sequencia [tipo comp larg acab qtd item], tenho que criar um array ordenado como demonstrado;

4 - Meu formmail pega todos os dados do formulário menos os campos criados por esse código;

5 - Quando removo um campo e tento adicionar outro no lugar, ora ele adiciona, ora tem que apertar várias vezes o botão para conseguir adicionar novamente os campos (tem alguma maneira de evitar que isso aconteça).

Tentei resolver o problema de número 1 com a função verificaNav(), mas não funcionou e todo o sistema parou de funcionar. Tentei solucionar o problema de número 5 com a função atualizaN(), mas também não funcionou e o campo "item" que está dentro de uma tag <select> parou de apresentar as opções. O que posso estar fazendo de errado.

Não sei se é possível, mas abaixo tem um modelo de como pretendo montar esse array do problema de número 2:

array(
tipo, comp, larg, acab, qtd, item
tipo, comp, larg, acab, qtd, item
tipo, comp, larg, acab, qtd, item
tipo, comp, larg, acab, qtd, item
tipo, comp, larg, acab, qtd, item
tipo, comp, larg, acab, qtd, item
	.
	.
	.
)

Fico grato por qualquer ajuda nos problemas citados.

Victor Cometti · Julho 3, 2011

seu código para verifcar só números com erros, mas desconsidere o seu e veja esse que eu acho mais simples

 
<script type='text/javascript'>
//retorna o número na tabela ascii de acordo com o navegador        
function verifica_navegador(event){
return document.all ? event.keyCode : event.which; 	
}
// função para o campo aceitar somente números
function Numero(e) {
   var tecla = verifica_navegador(e);
if ((tecla>=48) && (tecla<=57))
	return true;
else if(tecla == 8 || tecla == 0) //Backspace, Delete e setas direcionais(para mover o cursor, apenas para FF)
	return true;
return false;         
}               

<input type='text' onkeypress='return Numero(event);'>

agora para incluir, remover um, remover todos, adapta ae

<script type='text/javascript'>
 // declaração de variáveis
       var qtdeCampos = 0;


function addCampos(){
if ( qtdeCampos > 10 ) {
	alert('Não é possível adicionar mais campos!');//manda a caixa
	return false;//finaliza a função
}
//pega a tabela
var tabela = document.getElementById('tabela');
//cria linha
var linha  = document.createElement('tr');
	linha.setAttribute("id","linha"+qtdeCampos);//identifica a linha
//cria uma coluna
var coluna  = document.createElement('td');	
	//insere conteúdo na coluna
	coluna.innerHTML = '<input type="text" size="5" name="tipo[]" id="tipo'+qtdeCampos+'">';
linha.appendChild(coluna);//insere a coluna na linha

//cria outra coluna
coluna  = document.createElement('td');	
	//insere conteúdo na coluna
	coluna.innerHTML = '<input type="text" size="5" name="comp[]" id="comp'+qtdeCampos+'" onkeypress="return Numero(event);">';
linha.appendChild(coluna);

//cria mais outra coluna
coluna  = document.createElement('td');	
	//insere conteúdo na coluna
	coluna.innerHTML = '<input type="button" value="remover" onclick=removerCampo(\"linha'+qtdeCampos+'\") title="Apagar produto">';
linha.appendChild(coluna);

//necessário criar tbody para IE
var tbody = document.createElement("tbody");
tbody.appendChild(linha); // insere a linha no tbody
tabela.appendChild(tbody); // insere o tbody na tabela	             		

qtdeCampos++;	
}		
function removerCampo(linhaNum){
resposta = confirm("As informações serão excluídas permanentemente!\n\nDeseja prosseguir?");
if (resposta){//verifica resposta
	var d = document.getElementById('tabela');//pega a tabela
	var linha = document.getElementById(linhaNum).rowIndex;//pega a linha 
	d.deleteRow(linha);//remove a linha 
}	
}
function removeTodosCampos() {
   resposta = confirm("As informações serão excluidas permanentemente!\n\nDeseja prosseguir?");
   if (resposta) {
	while ( qtdeCampos > 0 ){
                       qtdeCampos-=1;
                       //verifica se o campo existe, pode ter sido apagado com a função removerCampo
		if( document.getElementById('linha'+qtdeCampos) != null ){
			var d = document.getElementById('tabela');//pega a tabela
			var linha = document.getElementById('linha'+qtdeCampos).rowIndex;//pega a linha 
			d.deleteRow(linha);//remove a linha
		}
	}
}
}
</script>
<table id='tabela'>
<tr class='sua_class'>
	<td>Título1</td>				
	<td>Título2</td>
	<td>Excluir</td>
</tr>
</table>
<input type='button' onclick=addCampos() value='adicionar campos'>
<input type='button' onclick=removeTodosCampos() value='remover todos os campos'>

com isso já é ótimo começo, o resto você desembola ae

dinhotaswolf · Julho 4, 2011

Obrigado pela ajuda Victor Cometti.

Implementei sua sugestão funcionou em todos os navegadores, mas o código para somente número tanto a sua sugestão quanto o meu antigo pararam de funcionar. Se deixo no código o sistema para de funcionar. Se retiro o código de somente número o sistema volta a funcionar.

Abaixo os dois códigos para analise:

// código que utilizava antes
// função para o campo aceitar somente números
function Numero(e) {
	navegador = /msie/i.test(navigator.userAgent);
	if (navegador) {
		var tecla = event.keyCode;
	} else {
		var tecla = e.which;

		if (tecla > 47 && tecla < 58) { // numeros de 0 a 9
			return true;
		} else if { (tecla != 2 || tecla != 3 || tecla != 8 || tecla != 127) { // teclas home, end, backspace e delete
				return false;
			} else {
				return true;
			}
		}
	}
}		


// sugestão do amigo Victor Cometti
// retorna o número na tabela ascii de acordo com o navegador        
function verifica_navegador(event) {
	return document.all ? event.keyCode : event.which;      
}

// função para o campo aceitar somente números
function Numero(e) {
	var tecla = verifica_navegador(e);
	if ((tecla>=48) && (tecla<=57)) {
		return true;
	} else if { (tecla == 0 || tecla == 2 || tecla == 3 || tecla == 8 || tecla == 127) { // teclas home, end, backspace, delete e setas direcionais (move cursor apenas no FF)
		return true;
	}
	return false;         
}

PS. nenhum dos dois funcionam agora.

Problemas que continuam em aberto:

1 - Gostaria de enviar dados para o email na sequencia [tipo comp larg acab qtd item], tenho que criar um array ordenado como demonstrado;

2 - Meu formmail pega todos os dados do formulário menos os campos criados por esse código;

3 - Quando removo um campo e tento adicionar outro no lugar, ora ele adiciona, ora tem que apertar várias vezes o botão para conseguir adicionar novamente os campos (tem alguma maneira de evitar que isso aconteça).

Fico grato por qualquer ajuda.

Victor Cometti · Julho 4, 2011

vamos por partes, no código acima você tem duas funções com mesmo nome

function Numero(e) {                
  navegador = /msie/i.test(navigator.userAgent);

e

 function Numero(e) {
               var tecla = verifica_navegador(e);

remove a sua função e usa a minha, ela funciona peerfeitamente

dinhotaswolf · Julho 4, 2011

Olá Victor Cometti,

obrigado pela resposta.

Estava somente a sua no meu código. No post anterior eu coloquei os dois códigos somente para comparação.

Depois que implementei as dicas que postou o meu código parou de funcionar em todos os navegadores. Então coloquei o seu e aconteceu o mesmo. Aí tirei os dois códigos para a função "Numero(e)" e o código que postou acima voltou a funcionar. Porém, agora não tenho mais como impedir a utilização de outros caracteres que não sejam números nos campos apenas numéricos, entendeu?

Porém, agora graças a sua ajuda o código funciona bem em todos os navegadores. Mas, preciso colocar a restrição para somente número em alguns campos e quando coloco tanto o seu como o código antigo que utilizava. O sistema para de funcionar para todos os navegadores.

Não sei o que pode estar acontecendo.

Fico grato pela ajuda,

Victor Cometti · Julho 4, 2011

é só chamar a função no evento onkeypress da text que deseja limitar a números, simplesmente assim, testa somente esse código abaixo e veja

teste.htm

<script type='text/javascript'>
//retorna o número na tabela ascii de acordo com o navegador        
function verifica_navegador(event){
       return document.all ? event.keyCode : event.which;      
}
// função para o campo aceitar somente números
function Numero(e) {
   var tecla = verifica_navegador(e);
       if ((tecla>=48) && (tecla<=57))
               return true;
       else if(tecla == 8 || tecla == 0) //Backspace, Delete e setas direcionais(para mover o cursor, apenas para FF)
               return true;
       return false;         
}               
</script>
<input type='text' onkeypress='return Numero(event);'>

dinhotaswolf · Julho 4, 2011

Olá Victor Cometti,

desculpe você tinha razão eu modifiquei seu código e por isso estava dando problema. Voltei ao original e agora está funcionando normalmente.

Fico grato pela sua grande ajuda.

Os problemas abaixo continuam em aberto:

1 - Gostaria de enviar dados para o email na sequencia [tipo comp larg acab qtd item], tenho que criar uma string como demonstrado e enviar em uma array para formmail;

2 - Meu formmail pega todos os dados do formulário menos os campos criados por esse código;

3 - Quando removo um campo e tento adicionar outro no lugar, ora ele adiciona, ora tem que apertar várias vezes o botão para conseguir adicionar novamente os campos (tem alguma maneira de evitar que isso aconteça).

Vou descrever abaixo como estou pensando em fazer o array para enviar via formulário os resultados dos campos adicionados, descrito no problema de número 1.

Arrays originais:
Tipo (T1 T2 T3 T4 T5 T6)
Comp (C1 C2 C3 C4 C5 C6)
Larg (L1 L2 L3 L4 L5 L6)
Acab (A1 A2 A3 A4 A5 A6)
Qtd (Q1 Q2 Q3 Q4 Q5 Q6)
Item (I1 I2 I3 I4 I5 I6)

Como pretendo que as string fiquem:
string1 (T1 C1 L1 A1 Q1 I1)
string2 (T2 C2 L2 A2 Q2 I2)
string3 (T3 C3 L3 A3 Q3 I3)
string4 (T4 C4 L4 A4 Q4 I4)
string5 (T5 C5 L5 A5 Q5 I5)
string6 (T6 C6 L6 A6 Q6 I6)

Array definitivo para envio:
Produto ( 
stritng1
stritng2
stritng3
stritng4
stritng5
stritng6
)

Não sei se é possível fazer dessa maneira. Mas se for agradeço por qualquer ajuda que possa dar.

Estava pensando em fazer como abaixo:

var tipo = new Array();
var comp = new Array();
var larg = new Array();
var acab = new Array();
var qtd = new Array();
var item = new Array();

var string0 = parents.concat(tipo[0], comp[0], larg[0], acab[0], qtd[0], item[0]);
var string1 = parents.concat(tipo[1], comp[1], larg[1], acab[1], qtd[1], item[1]);
var string2 = parents.concat(tipo[2], comp[2], larg[2], acab[2], qtd[2], item[2]);
var string3 = parents.concat(tipo[3], comp[3], larg[3], acab[3], qtd[3], item[3]);
var string4 = parents.concat(tipo[4], comp[4], larg[4], acab[4], qtd[4], item[4]);
var string5 = parents.concat(tipo[5], comp[5], larg[5], acab[5], qtd[5], item[5]);

var produto = new Array(string0, string1, string2, string3, string4, string5);

Será que funcionaria? Se sim, onde no código acima poderia implementar? É possível enviar essa string para o código PHP, através do formulário?

Fico grato por qualquer ajuda.

Victor Cometti · Julho 6, 2011

Da forma como está criando os inputs já fica fácil pegar pelo php. Não precisa fazer nada em relação a string e array via javascript para pegar os dados.

Este tópico é javascript!

Assim que resolver essa parte você cria um tópico no fórum php para terminar de resolver.

Att,

Victor

dinhotaswolf · Julho 6, 2011

Tudo bem, mas ainda tem um problema que é 100% javascript e ainda não tive resposta. Quando removo um campo e tento adicionar outro no lugar, ora ele adiciona, ora tem que apertar várias vezes o botão para conseguir adicionar novamente os campos (tem alguma maneira de evitar que isso aconteça).

Fico grato por qualquer ajuda.

Victor Cometti · Julho 7, 2011

ok, você remove um item, tem algum problema que o próximo item seja inserido no final, ou tem que ser exatamente naquele local que foi retirado o outro?

dinhotaswolf · Julho 7, 2011

É que quando eu excluo apenas uma linha dos campos adicionados e clico para adicionar novo campo novamente, ele adiciona normalmente. Mas, se removo mais de duas linhas e tento logo após adicionar novamente uma nova linha de campos, tenho que clicar no botão para adicionar um novo campo o mesmo número de campos que removi, como se na função addCampos() os campos removidos ainda estejam sendo considerados como campos ativos. Não sei se me fiz entender.

Crio dez campos, removo um consigo adicionar um novo campo.

Crio dez campos, excluo cinco não consigo adicionar novo campo com apenas um clique no botão adicionar novo campo. Tenho que clicar algumas vezes no botão para que ele adicione o novo campo.

A posição em que o novo campo vai aparecer não tem problema. O que preciso é que o campo seja adicionado novamente logo no primeiro clique no botão adicionar novo campo.

Creio que tenha que fazer algo para limpar o índice dos campos. Mas, não faço a menor ideia de como fazer isso.

Quanto ao problema de capturar o resultado desse código no formmail, abri um novo tópico na sessão PHP:

http://forum.imasters.com.br/topic/438010-como-pegar-campos-adicionados-dinamicamente-via-javascript-com-php/page__p__1729726__fromsearch__1#entry1729726

Fico grato por qualquer tipo de ajuda.

Victor Cometti · Julho 7, 2011

Considerando que o máximo de campos que são permitidos são 10.

Não esquenta em relação aos itens que foram removidos em ordenar índices.

O código que postei anteriormente fiz uma pequena modificação, que você mesmo poderia ter feito

testa dessa forma como está e veja o resultado, funciona bem, falta apenas algumas adaptações ao seu código

salva como teste.htm e veja

<script type='text/javascript'>
 // declaração de variáveis
       var qtdeCampos = 0;
	var removidos = 0;//para controle de campos removidos

function addCampos(){
	//verifico  a quantidade de campos na tela, considerando campos removidos e limitando a 10
       if ( (qtdeCampos - removidos) >= 10 ) {
               alert('Não é possível adicionar mais campos!');//manda a caixa
               return false;//finaliza a função
       }
       //pega a tabela
       var tabela = document.getElementById('tabela');
       //cria linha
       var linha  = document.createElement('tr');
               linha.setAttribute("id","linha"+qtdeCampos);//identifica a linha
       //cria uma coluna
       var coluna  = document.createElement('td');     
               //insere conteúdo na coluna
               coluna.innerHTML = '<input type="text" size="5" name="tipo[]" id="tipo'+qtdeCampos+'">';
       linha.appendChild(coluna);//insere a coluna na linha

       //cria outra coluna
       coluna  = document.createElement('td'); 
               //insere conteúdo na coluna
               coluna.innerHTML = '<input type="text" size="5" name="comp[]" id="comp'+qtdeCampos+'" onkeypress="return Numero(event);">';
       linha.appendChild(coluna);

       //cria mais outra coluna
       coluna  = document.createElement('td'); 
               //insere conteúdo na coluna
               coluna.innerHTML = '<input type="button" value="remover" onclick=removerCampo(\"linha'+qtdeCampos+'\") title="Apagar produto">';
       linha.appendChild(coluna);

       //necessário criar tbody para IE
       var tbody = document.createElement("tbody");
       tbody.appendChild(linha); // insere a linha no tbody
       tabela.appendChild(tbody); // insere o tbody na tabela                          

       qtdeCampos++;   
}               
function removerCampo(linhaNum){
       resposta = confirm("As informações serão excluídas permanentemente!\n\nDeseja prosseguir?");
       if (resposta){//verifica resposta
               var d = document.getElementById('tabela');//pega a tabela
               var linha = document.getElementById(linhaNum).rowIndex;//pega a linha 
               d.deleteRow(linha);//remove a linha 
			removidos ++;//incrementa removidos
       }       
}
function removeTodosCampos() {
   resposta = confirm("As informações serão excluidas permanentemente!\n\nDeseja prosseguir?");
   if (resposta) {
               while ( qtdeCampos > 0 ){
					qtdeCampos --;
                       //verifica se o campo existe, pode ter sido apagado com a função removerCampo
                       if( document.getElementById('linha'+qtdeCampos) != null ){
                               var d = document.getElementById('tabela');//pega a tabela
                               var linha = document.getElementById('linha'+qtdeCampos).rowIndex;//pega a linha 
                               d.deleteRow(linha);//remove a linha								
                       }
               }		
	removidos = 0;//reinicia
}
}
//retorna o número na tabela ascii de acordo com o navegador        
function verifica_navegador(event){
       return document.all ? event.keyCode : event.which;      
}
// função para o campo aceitar somente números
function Numero(e) {
   var tecla = verifica_navegador(e);
       if ((tecla>=48) && (tecla<=57))
               return true;
       else if(tecla == 8 || tecla == 0) //Backspace, Delete e setas direcionais(para mover o cursor, apenas para FF)
               return true;
       return false;         
}               

</script>
<table id='tabela'>
       <tr class='sua_class'>
               <td>Tipo</td>                                
               <td>Comp</td>
               <td>Excluir</td>
       </tr>
</table>
<input type='button' onclick=addCampos() value='adicionar campos'>
<input type='button' onclick=removeTodosCampos() value='remover todos os campos'>

dinhotaswolf · Julho 7, 2011

Muito obrigado amigo Victor Cometti!

Implementei as dicas acima e funcionou muito bem.

Estou muito grato pela ajuda.

dinhotaswolf · Julho 7, 2011

Olá Victor!

O código esta exatamente como no seu exemplo acima. Se você testar seu código vai perceber que ele gera um espaço entre a descrição dos campos e os novos campos.

O problema de remover todos os campos foi resolvido com o código abaixo:

// função para apagar todos os campos adicionados ao formulário
function removeTodosCampos() {
	resposta = confirm("As informações serão excluídas permanentemente!\n\nDeseja prosseguir?");
	if (resposta) {
		while ( qtdeCampos > 0 ) {
			qtdeCampos--;

			// verifica se o campo existe, pode ter sido apagado com a função removerCampo
			if( document.getElementById('linha'+qtdeCampos) != null ){
				var d = document.getElementById('tabela'); // pega a tabela
				var linha = document.getElementById('linha'+qtdeCampos).rowIndex; // pega a linha 
				d.deleteRow(linha); // remove a linha
				                  window.location.reload(); // atualiza página para eliminar os espaços gerados quando apagados todos os campos
			}
		}
           qtdeCampos = 0; // reinicia
           removidos = 0; // reinicia
}

Mas se não excluir todos de uma só vez e for excluindo um a um ele também deixa um espaço. Esse eu não consegui resolver e não sei se o problema esta na hora da exclusão ou na hora de adicionar os novos campos.

No IE e no Opera esse problema não ocorre, mas nos demais ocorre (Chrome, Mozilla, Netscape, Safari e Flock.).

Fico grato com qualquer ajuda.

Victor Cometti · Julho 8, 2011

é tem um bug, não tinha feito testes

observei agora, vou tentar resolver aqui

EDIT:

descobri

na função addCampos(), é criado o elemento tbody que necessário para internet explorer, e em alguns navegadores dá pau

muda essas linhas

var tbody = document.createElement("tbody");
tbody.appendChild(linha); // insere a linha no tbody

para essas

if ( document.all ){//se for IE
  var tbody = document.createElement("tbody");
  tbody.appendChild(linha); // insere a linha no tbody
}else{//senão
  var tbody = linha;
}

faz uns testes ae.

dinhotaswolf · Julho 8, 2011

Olá Victor!

Realizei a modificação citada. Troquei o trecho abaixo:

var tbody = document.createElement("tbody");
tbody.appendChild(linha); // insere a linha no tbody

Coloquei o código que citou:

if ( document.all ){//se for IE
  var tbody = document.createElement("tbody");
  tbody.appendChild(linha); // insere a linha no tbody
}else{//senão
  var tbody = linha;
}

Mas o sistema parou de funcionar em todos os navegadores. Reparei que a linha abaixo ficou fora do novo código que citou.

tabela.appendChild(tbody); // insere o tbody na tabela

Coloquei no código e ficou como abaixo:

if ( document.all ){//se for IE
  var tbody = document.createElement("tbody");
  tbody.appendChild(linha); // insere a linha no tbody
  tabela.appendChild(tbody); // insere o tbody na tabela
}else{//senão
  var tbody = linha;
}

Mas também não funcionou, ou melhor funcionou somente no IE e no Opera, nos outros não funcionou. Retornei ao código anterior e voltou a funcionar em todos, porém com o mesmo erro.

O que será que pode estar errado?

Fico grato por qualquer ajuda.

Victor Cometti · Julho 8, 2011

Funcionou perfeitamente aqui, testei no IE e FF, você deve ter modificado alguma coisa a mais, faça apenas as modificações que te falei.Retire as duas linhas

var tbody = document.createElement("tbody");  
tbody.appendChild(linha); // insere a linha no tbody

e coloque essas

if ( document.all ){//se for IE  
  var tbody = document.createElement("tbody");  
  tbody.appendChild(linha); // insere a linha no tbody  
}else{//senão  
  var tbody = linha;  
}

qualquer coisa, posta como ficou o código

dinhotaswolf · Julho 8, 2011

Olá Victor!

Desculpe, pela falta de atenção de minha parte. O erro era meu mesmo. Tinha deixado o código como vou demonstrar abaixo:

tabela.appendChild(tbody); // insere o tbody na tabela

if ( document.all ){//se for IE
  var tbody = document.createElement("tbody");
  tbody.appendChild(linha); // insere a linha no tbody
}else{//senão
  var tbody = linha;
}

Assim, não funcionou e não ia funcionar mesmo. Estava inserindo o tbody na tabela antes de receber o valor.

Agora, coloquei assim:

if ( document.all ){//se for IE
  var tbody = document.createElement("tbody");
  tbody.appendChild(linha); // insere a linha no tbody
}else{//senão
  var tbody = linha;
}

tabela.appendChild(tbody); // insere o tbody na tabela

Dessa maneira funcionou em todos os navegadores menos no Netscape que esta dando umas loucuras.

No Netscape, ele adiciona normal mas não remove os campos do segundo para frente. Quando tento remover o primeiro campo adicionado ele remove a linha que esta com a descrição dos campos e não a linha com os campos adicionados.

Mas, o que importa é que nos demais está funcionando normalmente (Chrome, Mozilla "FireFox, IE "Internet Explorer", Opera, Safari e Flock).

Novamente desculpe o transtorno.

Fico muito grato pela sua atenção em me ajudar.

Victor Cometti · Julho 8, 2011

eh!! no Netscape eu num sei o que pode ser porque eu nem tenho ele instalado aqui, abri um novo tópico em javascript a respeito incluindo a palavra Netscape no título, quem sabe alguém já passou por isso.

deve ser alguma coisa relacionado a índice da linha.

Vamos considerar esse tópico encerrado.

Arquivado

[Resolvido] Problemas com IE, string de array e remoção de campo

Recommended Posts

dinhotaswolf 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Victor Cometti 8

Compartilhar este post

Link para o post

Compartilhar em outros sites

dinhotaswolf 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Victor Cometti 8

Compartilhar este post

Link para o post

Compartilhar em outros sites

dinhotaswolf 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Victor Cometti 8

Compartilhar este post

Link para o post

Compartilhar em outros sites

dinhotaswolf 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Victor Cometti 8

Compartilhar este post

Link para o post

Compartilhar em outros sites

dinhotaswolf 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Victor Cometti 8

Compartilhar este post

Link para o post

Compartilhar em outros sites

dinhotaswolf 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Victor Cometti 8

Compartilhar este post

Link para o post

Compartilhar em outros sites

dinhotaswolf 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

dinhotaswolf 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Victor Cometti 8

Compartilhar este post

Link para o post

Compartilhar em outros sites

dinhotaswolf 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Victor Cometti 8

Compartilhar este post

Link para o post

Compartilhar em outros sites

dinhotaswolf 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Victor Cometti 8

Compartilhar este post

Link para o post

Compartilhar em outros sites

Fixar div até atingir uma certa altura