Grayout textbox on checkbox

by **stylus** » Tue Oct 18, 2005 11:55 am

Hello,

I am a php noobie, but have some experiance in web design, and development.

I am looking to have a form that if a certain checkbox gets checked, a text field will get grayed out so that the user can only choose one or the other.

probably a javascript function would work, but I don't know what would make the text box become grayed out/read only.

Here is a snippit of the form I am building

<tr bgcolor="#CCCCCC">
<td>Required Date:</td>
<td>Specific Time: <input type="text" name="required_date"><br>
Anytime: <input type="checkbox" name="required_date" value="anytime">
</td>
</tr>

Thanks

by **Alexei Kubarev** » Tue Oct 18, 2005 11:58 am

Moved to Javascript forum

by **Alexei Kubarev** » Tue Oct 18, 2005 12:02 pm

The solution would most probably be setting disabled property to true.

Code: Select all: <script type="text/javascript"> function disable(el) { getElementById(el).disabled=true; } </script> <input type="text" id="element1" /> <a href="javascript:disable('element1')">Disable</a>

by **stylus** » Tue Oct 18, 2005 2:03 pm

I tried to impliment that code, but got no where.

I got a "objected expected"

This is the code I tried to use.

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body>
<script type="text/javascript">
function disable(el)
{
getElementById(el).disabled=true;
}
</script>
<form name="test" method="post" enctype="multipart/form-data" >
<input type="text" id="el" name="element1">
</form>

<a href="javascript:disable('el')">Disable</a>
</body>
</html>

by **php-vikas** » Tue Oct 18, 2005 7:43 pm

Here is the working one.

Code: Select all: <html> <head> <title>Untitled Document</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head> <body> <SCRIPT language=javascript> function disable() { test.name.disabled=true; } </script> <form name="test" method="post" enctype="multipart/form-data" > <input type="text" id="name" name="element1"> </form> <a href="#" onClick="disable()">Disable</a> </body> </html>

by **Alexei Kubarev** » Wed Oct 19, 2005 2:34 am

okej.. hmmz.. i may have missed some small things, but the problem is that you need to get element by its ID for w3c complience...

by **stylus** » Thu Oct 20, 2005 4:22 pm

That code only seems to work when it is a link, I setup a radio box with onclick="disable()" and it doesn't update the form field. Is there a way to have it refreash an element by id? or does the whole page have to refreash?

thanks

by **ruturajv** » Thu Oct 20, 2005 8:03 pm

you don't need to refresh the page, and it will not help solve the prob.

make sure you the onclick event of the element is not disabling the very element itself.

Grayout textbox on checkbox

Grayout textbox on checkbox

Who is online