View Full Version : Enabling a text input field ONLY when a checkbox is ticked

12-22-2007, 01:11 AM
Hey everyone, as you can see I'm new here.

I'm working on a new section for a site.

Basically it's a layout creator, mostly, with a few customization options. Basically as you can see from the HTML below, there is a checkbox with the id "network" and a text input field with the id "username".

<div style="text-align: left;">
<b>2. Creation</b>
Here you can customize
<table align="center" cellpadding="5" width="95%" style="margin: 3px; padding: 5px; border: 2px solid black;">
<td align="center">
<table align="center" width="98%" cellspacing="1" cellpadding="3">
<td width="50%" style="text-align: center;">Replace the Extended Network Logo with your Dynamic Signature (?)<br><input type="checkbox" id="network" name="network" style="border:none;" value="_s" /></td>
<td width="50%" style="text-align: center;">Hide the Comments section (?)<br><input type="checkbox" id="comments" name="comments" style="border:none;" value="_p" /></td>
<input type="text" id="username" size="20" maxlength="12">
<font size="1">If you checked &quot;Replace Extended Network Logo&quot; you MUST enter your name here so the Signature can be created. Otherwise your signature WILL NOT DISPLAY.<br><br>If you'd like to keep the Extended Network Logo LEAVE THE ABOVE FIELD BLANK!</font>
<input type="button" value="Generate my Layout!" style="text-align: center;" onClick="make_sig()" onSubmit="make_sig()">
<div id="urlbox"></div>

Basically, I need to know how I can have the username field disabled by default, and then enabled only WHILE the network checkbox is checked.

I'm not too sure how to do this. But I have some sort of idea. Perhaps something like this (excuse the sloppy and incorrect structure, this is just to demonstrate)

if (document.getElementById("network").checked==true THEN document.getElementById("username").disabled==false)

You know, basically something stating WHILE the network checkbox is checked the username field will be enabled and if network is unchecked, username becomes disabled.

Thanks. :thumbsup:

12-22-2007, 04:53 AM
<!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">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript">
// <![CDATA[
function ifChecked(frm){
frm.username.disabled = !frm.network.checked
// ]]>

Username:<br />
<input type="text" name="username" disabled="disabled" /><br />
<input type="checkbox" name="network" id="network" onclick="ifChecked(this.form)" /><label for="network">Check here to enable textbox.</label>