Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Dec 2007
    Posts
    8
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Enabling a text input field ONLY when a checkbox is ticked

    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".

    Code:
    <div style="text-align: left;">
    <b>2. Creation</b>
    </div>
    <br>
    Here you can customize
    <br><br>
    <table align="center" cellpadding="5" width="95%" style="margin: 3px; padding: 5px; border: 2px solid black;">
    <tr>
    <td align="center">
    <table align="center" width="98%" cellspacing="1" cellpadding="3">
    <tr>
    <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>
    </tr>
    </table>
    <input type="text" id="username" size="20" maxlength="12">
    <br>
    <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>
    <hr>
    <input type="button" value="Generate my Layout!" style="text-align: center;" onClick="make_sig()" onSubmit="make_sig()">
    <div id="urlbox"></div>
    </table>
    <br>
    </td>
    </td>
    </table>
    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)

    Code:
    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.

  • #2
    JUD
    JUD is offline
    New Coder
    Join Date
    Jul 2005
    Location
    I'm right here
    Posts
    92
    Thanks
    0
    Thanked 2 Times in 2 Posts
    Code:
    <!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 type="text/javascript">
    	// <![CDATA[
    		function ifChecked(frm){
    			frm.username.disabled = !frm.network.checked
    		}
    	// ]]>
    </script>
    </head>
    
    <body>
    	<form>
        	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>
        </form>
    </body>
    </html>

  • Users who have thanked JUD for this post:

    Dale_G (12-24-2007)


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •