Ir para conteúdo

POWERED BY:

Arquivado

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

Jobless

Modificar atributo de campo text field para readonly="readonly&qu

Por , em Javascript

Recommended Posts

Jobless    0

Jobless
Postado

Galera sou iniciante em Javascript, mas preciso da ajuda de vocês para implementar meu código:

 

Preciso do seguinte:

 

1- Tenho 3 Radio Buttons e 3 Text Fields, configurei o 1º Radio Button para iniciar como Checked.

 

2- Preciso que ao carregar a página o Text Field 2 e 3 tenham o atributo Ready-only(Nativo do próprio HTML creio eu).

 

3- Ao selecionar o segundo Radio Button, o 1º e 3º Text Field fiquem com o atributo Ready-only e se o terceiro Radio Button for selecionado então o 1º e 2º Text Field ficam com o atributo Ready-only.

 

Coisa simples de se fazer, porém como disse estou engatinhando em javascript

 

Podem me ensinar como fazer?

 

Segue o código que comecei a fazer:

 

<!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>
</head>

<body>
<form id="form1" name="form1" method="post" action="">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="10%"> </td>
<td> </td>
</tr>
<tr>
<td align="right"><input name="radio" type="radio" id="radio" value="radio" checked="checked" /></td>
<td><input type="text" name="textfield" id="textfield" /></td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
<tr>
<td align="right"><input type="radio" name="radio" id="radio2" value="radio2" /></td>
<td><input name="textfield2" type="text" id="textfield2"/></td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
<tr>
<td align="right"><input type="radio" name="radio" id="radio3" value="radio3" /></td>
<td><input type="text" name="textfield3" id="textfield3" /></td>
</tr>
</table>
</form>
</body>
</html>

Valeu Galera!

Compartilhar este post

Link para o post
Compartilhar em outros sites

eibon    2

eibon
Postado 

<html>

<head>

<title>Exemplo</title>

</head>

<script type="text/JavaScript">

adicionaEvento(window, 'load', function(){

adicionaEvento(document.getElementsByName("chk")[0], 'click', function(){

var inp = document.getElementsByName("tx1")[0];

/*base...checar se um checkbox está marcado: checkBox.checked -> true | false*/

if(inp.getAttribute("readonly")) inp.removeAttribute("readonly");

else inp.setAttribute("readonly", "readonly");

}, false);

}, false);

 

function adicionaEvento(elemento, evento, funcao, bool){

bool = (bool == null)? false : bool;

if(elemento.addEventListener)

elemento.addEventListener(evento, funcao, bool);

else

elemento.attachEvent('on' + evento, funcao);

}

</script>

<body>

Toggle input readonly:<input type="checkbox" name="chk" />

<input type="text" name="tx1" />

</body>

</html>

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