benign Posted August 4, 2006 Share Posted August 4, 2006 Hi:Is it possible that I have a html check box that if I check it it unhide the rest of the form? For example if the user has telephone he checks the check box and then the text field for the telephone appears.ThanksBenign Link to comment Share on other sites More sharing options...
Chandra.Vedantham@gmail.com Posted August 4, 2006 Share Posted August 4, 2006 Hi,Hope this helps: <!doctype html public "-//w3c//dtd html 4.0 transitional//en"><html><head><title>Unhide</title> <meta name="Author" content="Chandra Vedantham"> <meta name="Description" content="Html Page"> <style> * { font-family: "Tahoma"; font-size: 11; color: Navy; } body { background-color: "#FFFFF2"; margin-left: 0; font-family: "Tahoma"; font-size: 11; color: Navy; margin-top: 0; margin-bottom: 0; margin-right: 0; } td.leftholder { width: 20%; background-color: "#D6D69E"; text-align: right; vertical-align: top; font-weight: bold; border-style: solid; border-width: 1px; border-color: black; padding-right: 15px; } td.rightholder { width: 80%; border-style: solid; border-width: 1px; border-color: black; text-align: left; vertical-align: top; padding-left: 15px; } .text { text-align: left; border-width: 1px; border-color: Gray; border-style: inset; margin-top: 1px; margin-bottom: 1px; } .title { font-weight: bold; color: #993300: font-size: 15px; } </style></head><body> <br/> <br/> <table width="100%" rules="all" bordercolor="black" border="1" cellspacing=0 cellpadding=0 style="border-collapse:collapse"> <tr> <td colspan=2 ><span class="title">Fill all the details:</span></td> </tr> <tr> <td class="leftholder">Name</td> <td class="rightholder"><input type="text" class="text" /></td> </tr> <tr> <td class="leftholder">Address</td> <td class="rightholder"><input type="text" class="text" /></td> </tr> <tr> <td class="leftholder"> Telephone<input type="checkbox" onClick="txtTelephone.style.visibility = (this.checked)?'':'hidden'"/> </td> <td class="rightholder" align="center"> <input type="text" class="text" id="txtTelephone" style="visibility:hidden"/> </td> </tr> </table></body></html> Link to comment Share on other sites More sharing options...
justsomeguy Posted August 5, 2006 Share Posted August 5, 2006 That looks good, but I'm not sure if this will work (it might, I haven't tested):<input type="checkbox" onClick="txtTelephone.style.visibility = (this.checked)?'':'hidden'"/>You might need to specify 'visible':<input type="checkbox" onClick="txtTelephone.style.visibility = (this.checked)?'visible':'hidden'"/>Or you can also use display instead of visibility:<input type="checkbox" onClick="txtTelephone.style.display = (this.checked)?'inline':'none'"/><input type="text" class="text" id="txtTelephone" style="display: none;"/> Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now