[Resolvido] Como clicar em uma compo e aparecer um text field

[Adilson_Web_2007 0]

Oi pessoal como eu faço para que quando o usuário clicar no campo aparece um text field com a infoprmação dentro do campo. Pois eu preciso atualizar algumas informações se fosse todas montaria um novo formulario.

 

Para que fique mais claro é o seguinte.

 

Tenho uma tabela onde as informações vem do banco de dados, quando o usuario clicar no campo da tabela, gostaria que a informação ficasse dentro do text field. Alguém pode me ajudar por favor.

 

Eu começei assim:

 

<td bgcolor="#DEDFDE" colspan="2" [b]onClick="MostraCampo();"[/b]><%=destacaAlterado(rsTabela("contratante"))%><div align="right" class="style1"><div align="right"></div></div></td>

E fiz uma função

 

<script>
function MostraCampo()
{
  alert("ok"); // Coloquei isso para ver se a chamada dava certo.
}
</script>

Desde já eu agradeço

[Otata 4]

eae cara um ex pra você

 

<script>


function mostraCampo(obj,valor){
	var newInput = document.createElement("input");
	newInput.type = "text";	
	newInput.value = obj.innerHTML;

	obj.innerHTML = "";

	obj.appendChild(newInput);

}

</script>
<table border="1">
	<tr>
		<td onclick="mostraCampo(this)">Vou virar um txt!
		</td>
	</tr>
</table>

[Adilson_Web_2007 0]

deu certo qundo eu cliquei ficou beleza, ai eu deu outro clique ele colocou input type dentro do text field.

 

Tenho outra dúvida também quero aumentar o campo e por dois botões na frente 1 de atualizar e outro de limpar.

 

Mais uma vez obrigado e desculpe a demora para responser ta corrido aqui hoje http://forum.imasters.com.br/public/style_emoticons/default/clap.gif

[berkowitz 2]

Fala velho! Firme?

 

Você quer colocar dois botões dentro do campo que você criou?

[Adilson_Web_2007 0]

não!

 

na frente para que a pessoa possa atualizar os dados.

 

Quando eu clico no campo ele abre o input com as informação que estava no campo perfeito, se eu clico nele para escrever ou alterar alguma informaçõa aparece isso dentro do input e ele não deixa eu escrevcer nada eu preciso dar um tabe..

 

<INPUT size=80 value='<INPUT size=80 value="ADTED ASSESSORIA E DESENVOVLIMENO DE TECNOLOGIAS EDUCACIONAIS">'>

[berkowitz 2]

certo...

 

Acho que você vai ter que pegar a função que o Otata lhe passou e fazer uma modificação pra saber se já existe um INPUT ali. Só então você cria (ou não) ele... tendeu?

 

Colocar o botão do lado do input é mais simples. Pega a tabela que está o campo e insere mais uma coluna, e aí você insere os botões do lado! eheehe...

 

ABRAX!!

[Adilson_Web_2007 0]

Entendi mas como fazer não sei muita coisa de DOM e javascript, estou pesquisando para ter mais claresa, me ajude por favor!

[berkowitz 2]

certo...

 

Não estou podendo testar agora! Veja se isso funciona:

 

function mostraCampo(obj,valor){
	var newInput = document.createElement("input");
	newInput.type = "text";	

	if(obj.innerHTML.indexOf("input") < 0) {
		newInput.value = obj.innerHTML;
		obj.innerHTML = "";
		obj.appendChild(newInput);
	}
}

Essa é a linha de pensamento que você precisa seguir... entendeu?

 

ABRAX!

[Adilson_Web_2007 0]

Não deu certo to perdido amigo!

[berkowitz 2]

vou ter que te responder depois... agora não tem como testar! hehhe...

[Adilson_Web_2007 0]

Eu fiz assim e deu certo, não sei se é a melhor forma de fazer.

 

var i = -1;
function mostraCampo(obj,valor){
		

	if(obj.innerHTML.indexOf("input") == i) {
	   var newInput = document.createElement("input");
		newInput.type = "text";
		newInput.size = "40";
		newInput.value = obj.innerHTML;
		obj.innerHTML = "";
		obj.appendChild(newInput);
		
	}
	i=i+1;
		
	
}

[Otata 4]

eae pessoal, complementando

 

<script>

function mostraCampo(obj){
		
	if(obj.getElementsByTagName("input").length == 0){
		
		var newInput = document.createElement("input");
		newInput.type = "text";	
		newInput.value = obj.innerHTML;
		newInput.size = "40";
			
		var btAtualizar = document.createElement("input");
		btAtualizar.type = "button";
		btAtualizar.id = "btAtualizar";
		btAtualizar.value = "Atualizar";
	
		var btLimpar = document.createElement("input");
		btLimpar.type = "button";
		btLimpar.id = "btLimpar";
		btLimpar.value = "Limpar";
			
		obj.innerHTML = "";

		obj.appendChild(newInput);
		obj.appendChild(btAtualizar);
		obj.appendChild(btLimpar);	
	}
}

</script>
<table border="1">
	<tr>
		<td onclick="mostraCampo(this)">Vou virar um txt!</td>
	</tr>
</table>

[berkowitz 2]

POw Otata! loko isso hein! :D :D

 

VALEW a dica!

 

ABRAX!!

[Adilson_Web_2007 0]

É isso mesmo ficou muito bom, muito obrigado pela força. http://forum.imasters.com.br/public/style_emoticons/default/clap.gif

 

Tenho mais umas dúvidas tem como colocar o evento no botão atualizar para que quando o usuário clicar, ele chamar a função que atualiza? E depois que atualizar voltar como ela uma linha de uma tabela com o valor atualizado.

[Adilson_Web_2007 0]

Tenho mais umas dúvidas tem como colocar o evento no botão atualizar para que quando o usuário clicar, ele chamar a função que atualiza? E depois que atualizar voltar como ela uma linha de uma tabela com o valor atualizado.

Eu consegui o evento vou postar para ajudar alguém, que eventualmente precise.

 

Segue

 

var btAtualizar = document.createElement("input");
		btAtualizar.type = "button";
		btAtualizar.id = "btAtualizar";
		btAtualizar.value = "Atualizar";
		btAtualizar.onclick=function AtualizaCadastro(){alert("teste");};

Pessoal so falta essa parte aqui para terminar

 

Eu preciso pegar o valor do campo e atualizar e depois voltar para a linha da tabela que outrora era um imput

[nknk 3]

Veja se a solução que eu crei atende tb.

http://forum.imasters.com.br/index.php...view=getnewpost