Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

João Augusto

[Resolvido] Habilitar ou Ocultar campos

Por , em Javascript

Recommended Posts

João Augusto    0

João Augusto
Postado

Fala galera, to com um pekeno problema eu preciso ocultar ou habilitar inputs texto dentro de uma tabela atraves de um button que fica fora da tabela..

Tá ai o code da tabela com o CSS dela tb e com os buttons fora da tabela....

Quem puder me ajudar eu estou com uma urgência nesse caso....

vlw..........

 

 

 

		 <style type="text/css">
table {font: normal 11px "Lucida Console";}
table{margin: 0px;}
table,th,td{border-collapse: collapse;}
th,td{border-bottom: 0px solid #000000;padding: 0px;}
th span{display: block; padding: 3px}
td span{display: block; padding: 3px}
#lista table {width:600px;}
#lista th{color: #FFFFFF;background-color: #181AC5;text-align: left}
#lista.tabContainer {width: 600px;border: 1px solid #000000}
#lista.scrollContainer {width: 618px;height: 400px;overflow: auto;}
.font{font-family: Verdana, Arial, Helvetica, sans-serif;
font-size:13px;
font-style:normal;
font-weight: bold;
font-variant: normal;
color:#FFFFFF;}  
	</style>
  
  
  <tr>
   <td colspan="5" align="center" valign="middle" background="file:///G|/WFat/img/layout.jpg">
<form action="file:///G|/WFat/wfat.cgi" name="fCadFir" method="post">
<div align="center"><table width="97%" height="178" align="center" class="corpo-mono">
  <tr><td><br>
  <fieldset class="corpo-mono">
<legend class="fieldset-legend">Cadastro de Serviços:</legend>
<br>
   
					 <div align="center">
							  <div class="tabContainer" id="lista">
								<div class="scrollContainer" id="lista">
								  <table border="0">
									<tbody>
									  <tr>
										<td bgcolor="#0A36E4" class="font"><span>  Código</span> </td>
										<td width="168" bgcolor="#0A36E4" class="font" align="left"><span>Descrição </span> </td>
										<td width="75" bgcolor="#0A36E4" class="font" align="right">Perfil >></td>
										<td width="60" bgcolor="#0A36E4" class="font" align="center">A</td>
										<td width="61" bgcolor="#0A36E4" class="font" align="center">B</td>
										<td width="59" bgcolor="#0A36E4" class="font" align="center">C</td>
										<td width="57" bgcolor="#0A36E4" class="font" align="center">D</td>
										<td width="57" bgcolor="#0A36E4" class="font" align="center"><span>E</span> </td>
									  </tr>
									  
									  <tab>
									  
									  <tr>
										<td width="76"><span>
										  <input type="radio" name="cde" value=12317 checked />
										  1231</span></td>
										<td colspan="2" align="left">3232323232323232323232</td>
										<td width="60">-12.05</td>
										<td width="61">-12.05</td>
										<td width="59">-12.05</td>
										<td width="57">-12.05</td>
										<td width="57">-12.05</td>
									  </tr>
									  <tr>
										<td width="76">
										  <input type="text" name="cde" size="5"></td>
										<td colspan="2" align="left"><input type="text" name="cde" size="5"></td>
										<td width="60"><input type="text" name="cde" size="5"></td>
										<td width="61"><input type="text" name="cde" size="5"></td>
										<td width="59"><input type="text" name="cde" size="5"></td>
										<td width="57"><input type="text" name="cde" size="5"></td>
										<td width="57"><input type="text" name="cde" size="5"></td>
									  </tr>
									 
									 
									</tbody>
								  </table>
						  </div>
							  </div>
					  </div>
					  <br />
					  <br />
		   <br>
		   <br><div align="center"><input type="button"  name="btn" value="Alterar">   
			 <input type="button"  value="Incluir" >   <input type="submit" name="btn" value="Excluir">
</div></fieldset></td></tr></table></div></form>

Compartilhar este post

Link para o post
Compartilhar em outros sites

webmind    5

webmind
Postado 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Untitled Document</title>

<script>

function mostrar(x,w){

div=document.getElementById(w);

if(div.style.display=="none"){

div.style.display="";

}

else if(div.style.display=="") {

x.value="Ocultar";

div.style.display="none";

}

}

</script>

</head>

 

<body>

<style type="text/css">

table {font: normal 11px "Lucida Console";}

table{margin: 0px;}

table,th,td{border-collapse: collapse;}

th,td{border-bottom: 0px solid #000000;padding: 0px;}

th span{display: block; padding: 3px}

td span{display: block; padding: 3px}

#lista table {width:600px;}

#lista th{color: #FFFFFF;background-color: #181AC5;text-align: left}

#lista.tabContainer {width: 600px;border: 1px solid #000000}

#lista.scrollContainer {width: 618px;height: 400px;overflow: auto;}

.font{font-family: Verdana, Arial, Helvetica, sans-serif;

font-size:13px;

font-style:normal;

font-weight: bold;

font-variant: normal;

color:#FFFFFF;}

</style>

 

 

<tr>

<td colspan="5" align="center" valign="middle" background="file:///G|/WFat/img/layout.jpg">

<form action="file:///G|/WFat/wfat.cgi" name="fCadFir" method="post">

<div align="center"><table width="97%" height="178" align="center" class="corpo-mono">

<tr><td><br>

<fieldset class="corpo-mono">

<legend class="fieldset-legend">Cadastro de Serviços:</legend>

<br>

 

<div align="center">

<div class="tabContainer" id="lista">

<div class="scrollContainer" id="lista">

<table border="0">

<tbody>

<tr>

<td bgcolor="#0A36E4" class="font"><span>  Código</span> </td>

<td width="168" bgcolor="#0A36E4" class="font" align="left"><span>Descrição </span> </td>

<td width="75" bgcolor="#0A36E4" class="font" align="right">Perfil >></td>

<td width="60" bgcolor="#0A36E4" class="font" align="center">A</td>

<td width="61" bgcolor="#0A36E4" class="font" align="center">B</td>

<td width="59" bgcolor="#0A36E4" class="font" align="center">C</td>

<td width="57" bgcolor="#0A36E4" class="font" align="center">D</td>

<td width="57" bgcolor="#0A36E4" class="font" align="center"><span>E</span> </td>

</tr>

 

<tab>

 

<tr>

<td width="76"><span>

<input type="radio" name="cde" value=12317 checked />

1231</span></td>

<td colspan="2" align="left">3232323232323232323232</td>

<td width="60">-12.05</td>

<td width="61">-12.05</td>

<td width="59">-12.05</td>

<td width="57">-12.05</td>

<td width="57">-12.05</td>

</tr>

<tr id="butoes" style="display:none">

<td width="76">

<input type="text" name="cde" size="5"></td>

<td colspan="2" align="left"><input type="text" name="cde" size="5"></td>

<td width="60"><input type="text" name="cde" size="5"></td>

<td width="61"><input type="text" name="cde" size="5"></td>

<td width="59"><input type="text" name="cde" size="5"></td>

<td width="57"><input type="text" name="cde" size="5"></td>

<td width="57"><input type="text" name="cde" size="5"></td>

</tr>

 

 

</tbody>

</table>

</div>

</div>

</div>

<br />

<br />

<br>

<br><div align="center"><input type="button" name="btn" value="Alterar">   

<input type="button" value="Incluir" >   <input type="submit" name="btn" value="Excluir">   <input type="button" name="butao" value="Mostrar inputs" onclick="mostrar(this,'butoes')" />

</div></fieldset></td></tr></table></div></form>

</body>

</html>

Compartilhar este post

Link para o post
Compartilhar em outros sites

novato_PHP    0

novato_PHP
Postado 

<div id="input" style="z-index:0; overflow: auto; visibility: visible;"> 
	Digite o nome<input type="text" name="nome">
	</div>
	<a href="java script:document.getElementById('input').style.visibility='visible';void(0);">mostra input</a> - <a href="java script:document.getElementById('input').style.visibility='hidden';void(0);">Ocultar input</a>

Adapta para sua situação....

Compartilhar este post

Link para o post
Compartilhar em outros sites

João Augusto    0

João Augusto
Postado 

<div id="input" style="z-index:0; overflow: auto; visibility: visible;"> 
	Digite o nome<input type="text" name="nome">
	</div>
	<a href="java script:document.getElementById('input').style.visibility='visible';void(0);">mostra input</a> - <a href="java script:document.getElementById('input').style.visibility='hidden';void(0);">Ocultar input</a>

Adapta para sua situação....

Mais eu tenho que fazer esses inputs aparecerem quando clicar no button "incluir", dando foco a os inputs.............

Compartilhar este post

Link para o post
Compartilhar em outros sites

webmind    5

webmind
Postado
entao eu postei o codigo ae acima, nao viu meu post??? e so colocar a funcao mostrar(this,'butoes') no butao incluir

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito