Desabilitar e Habilitar Campos

Neto Gerbi · Setembro 9, 2009

gostaria de fazer um unico formulario para cadastro, edição e exclusão de usuario. no caso, quando o usuario loga, os campos do cadastro aparecem desabilitados:

ex:

Nome: <input name="txtNome" type="text" id="txtNome" value="<?php echo $usuario['NOME'] ?>" disabled><br/><br/>

reparem no comando "disabled"!

entao eu gostaria que quando o usuario clicasse no botão editar do formulario,este campo se tornasse habilitado para edição utilizando uma funçao java que faça isso!

exemplo do botão:

<INPUT TYPE="button" VALUE="Alterar" onClick="editar()">

ainda sou novo em javascript... como faço para habilitar o campo!?!?!?

Obrigado!!!

Kandrade · Setembro 9, 2009

Vou mover para o fórum correto.

Plataforma Java http://forum.imasters.com.br/public/style_emoticons/default/seta.gif JavaScript

klonder · Setembro 9, 2009

<html>

<head>

function editar() {

var objtxt = document.getElementById("txtNome");

objtxt.disabled = false;

}

</script>

</head>

<body>

Nome: <input name="txtNome" type="text" id="txtNome" value="####" disabled>

</body>

</html>

Neto Gerbi · Setembro 9, 2009

perfeito... testei este codigo e nao deu certo mas ja tenho um ponto de partida para pesquisar...

mas e no caso se forem varios campos?!

Valeuu []s

Neto Gerbi · Setembro 9, 2009

nao consigo resolver mesmo... da erro na pagina

axo q nao estou fazendo de acordo com o funcionamento do js!

o erro é: Object Expected na linha 87, mas esta linha nem mesmo existe no documento

veja o codigo:

<?php session_start(); ?>

<!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>E-GIFT</title>
<link href="css.css" rel="stylesheet" type="text/css" />
<script LANGUAGE="JavaScript" type="text/javascript">
function excluir(){
	if (confirm("Esse usuário será excluído permanentemente.\nDeseja prosseguir?")) {
		window.location.href="controle.php?acao=excluir";
	}
}
function cadastrar(){
	window.location.href="controle.php?acao=cadastrar";
	//esta função ainda nao está funcionando
}
function editar(){
	document.getElementById("txtNome").readonly="false";
}
</script>



</body>
</html>
</head>

<body>

<div id="container">
   
    <?php include ("inc_header.php"); ?>
    
    <?php include ("inc_menunav.php"); ?>
    
    <?php include ("inc_menu.php"); ?>
    
   <div id="contents">
		<?php 
		include($_SERVER['DOCUMENT_ROOT']."/apjs0307/egift/OO/Usuario.class.php");
		include($_SERVER['DOCUMENT_ROOT']."/apjs0307/egift/OO/DAO/UsuarioDAO.class.php");
		
		if(isset($_SESSION["usuario"])){
			$aux=new Usuario();
			$aux->setUserId($_SESSION["usuario"]);
			$auxdao=new UsuarioDAO($aux);
			$usuario=$auxdao->consultarUsuario();
		}
		
		if(strcmp($_GET['acao'],"excluir")==0){
			$auxdao->excluirUsuario();
			header("Location: index.php");
		}elseif(strcmp($_GET['acao'],"salvar")==0){//esta ação salvar serve para salvar quando editado
		}

		?>
		
		<div align="right" class="formulario_cadastro" >
		<form method="post" name="form_controle">
		Nome: <input name="txtNome" type="text" id="txtNome" value="<?php echo $usuario['NOME'] ?>" disabled><br/><br/>
		Usuario: <input name="txtUsuario" type="text" id="txtUsuario" value="<?php echo $usuario['USERID'] ?>" disabled><br/><br/>
		Senha: <input name="txtSenha" type="text" id="txtSenha" value="<?php echo $usuario['PSWD'] ?>" disabled><br/><br/>
		Grupo: <input name="txtGrupo" type="text" id="txtGrupo" value="<?php echo $usuario['GNOME'] ?>" disabled> <br/><br/>
		
		<INPUT TYPE="button" VALUE="Excluir" onClick="excluir()" >
		<INPUT TYPE="button" VALUE="Alterar" onClick="editar()" >


		</form>
		</div> 
    </div>

    
    <?php include ("inc_footer.php"); ?>
    
</div>

</body>
</html>

klonder · Setembro 10, 2009

O código que postei está funcionando perfeitamente, testei no IE7 e FF. Por gentileza, teste apenas o código limpo, sem adicionar ou modificar qualquer vírgula, ou acrescentar quaisquer tipos de códigos PHP ou alterar qualquer letra de quaisquer variáveis.

Resumindo: teste o código do jeito que ele está para você compreender o funcionamento! Não altere-o!!!

Outra coisa: o código que você postou contém erros nas linhas 26 e 27. Além disso, você está querendo trabalhar com readonly ou disabled? É importante tomar essa decisão pois você está misturando as coisas (vide linhas: 20 e 62).

O código abaixo está funcionando para o primeiro textfield:

<html>
<head>
<title>E-GIFT</title>
<script type="text/javascript">
function editar() {
var objTXT = document.getElementById("txtNome");	
	objTXT.disabled = false;
}
</script>
</head>
<body>
<form method="post" name="form_controle">
Nome: <input name="txtNome" type="text" id="txtNome" value="aaaa" disabled><br/><br/>
Usuario: <input name="txtUsuario" type="text" id="txtUsuario" value="aaaa" disabled><br/><br/>
Senha: <input name="txtSenha" type="text" id="txtSenha" value="aaaa" disabled><br/><br/>
Grupo: <input name="txtGrupo" type="text" id="txtGrupo" value="aaaa" disabled> <br/><br/>
<INPUT TYPE="button" VALUE="Excluir" onclick="excluir()" >
<INPUT TYPE="button" VALUE="Alterar" onclick="editar()" >
</form>
</body>
</html>

Isto posto, com certeza podemos então perceber que o erro NÃO é no JavaScript, mas poderá ser no PHP, pois você está incluindo muitos arquivos, conforme o código do seu post acima.

Neto Gerbi · Setembro 10, 2009

realmente... agora funcionou mesmo!!!!

refiz o codigo e coloquei igual o seu!!!

valeu cara!!!

seguindo o mesmo assunto, no caso eu tentei alterar umas coisas q nao funcionaram veja:

function editar(){
	var objTXT = document.getElementById("txtNome");
	objTXT.disabled = false;
	objTXT = document.getElementById("txtUsuario");
	objTXT.disabled = false;
	objTXT = document.getElementById("txtSenha");
	objTXT.disabled = false;
	
	var objButton = document.getElementById("btnAlterar");
	objButton.value="Salvar";
	objButton.onClick="salvar()";
}
function salvar(){
	window.location.href="controle.php?acao=salvar";
}

o que estou tentando fazer é alterar o evento onClick de um botao que antes executava a própria função editar. ao executar esta função, uma outra entraria em vigor caso eu clicasse no mesmo botao novamente, entende!?

é aquele botao editar que vira salvar sabe!? hehehe

VALEUU AMIGO

klonder · Setembro 10, 2009

Sugiro fazer diferente por um motivo: dificuldade na manipulação do evento do botão.

Nesse caso, você também poderá trocar de "button" para "submit", mas isso de acordo com as suas necessidades. Você também poderá criar uma função exclusiva para o envio do formulário, que é o que estou propondo (abrindo o caminho apenas) com o código abaixo:

<html>
<head>
<title>E-GIFT</title>
<script type="text/javascript">
function editar() {
var objTXT = document.getElementById("txtNome");        
        objTXT.disabled = false;
        var objBtnAlterar = document.getElementById("btnAlterar");
        var objBtnSalvar = document.getElementById("btnSalvar");
        objBtnAlterar.style.display = "none";
        objBtnSalvar.style.display = "inline";
}
</script>
</head>
<body>
<form method="post" name="form_controle">
Nome: <input name="txtNome" type="text" id="txtNome" value="aaaa" disabled><br/><br/>
Usuario: <input name="txtUsuario" type="text" id="txtUsuario" value="aaaa" disabled><br/><br/>
Senha: <input name="txtSenha" type="text" id="txtSenha" value="aaaa" disabled><br/><br/>
Grupo: <input name="txtGrupo" type="text" id="txtGrupo" value="aaaa" disabled> <br/><br/>
<INPUT TYPE="button" id="" VALUE="Excluir" onclick="excluir()">
<INPUT TYPE="button" id="btnAlterar" VALUE="Alterar" onclick="editar()"><INPUT TYPE="button" id="btnSalvar" VALUE="Salvar" onclick="enviarForm()" style="display:none;">
</form>
</body>
</html>

As adaptações agora irão depender de suas necessidades. Agora ficou fácil!

Abraços!

Neto Gerbi · Setembro 10, 2009

com o submit nao deu certo, mas dessa forma que voce ndicou deu sim... vale amigo

somente no firefox nao funcionou... pq será!?

Arquivado

Desabilitar e Habilitar Campos

Recommended Posts

Neto Gerbi 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Kandrade 7

Compartilhar este post

Link para o post

Compartilhar em outros sites

klonder 14

Compartilhar este post

Link para o post

Compartilhar em outros sites

Neto Gerbi 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Neto Gerbi 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

klonder 14

Compartilhar este post

Link para o post

Compartilhar em outros sites

Neto Gerbi 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

klonder 14

Compartilhar este post

Link para o post

Compartilhar em outros sites

Neto Gerbi 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Fixar div até atingir uma certa altura

Ajuda com Extends e envio para o banco

PHP+Codeginiter - Orientação para Impressão

Fóruns

Tempo Real

Informação importante