• stuck
  • New member
  • Offline
  • Registered: 2009-07-03
  • Posts: 8

Topic: i need to show a form only when a checkbox is ticked

i need to show a form only when a checkbox is ticked.
Im guessing i need to use jquery to do this.
Anyone know of a tutorial which explains this - or even better your advice.

  • Registered: 2009-04-30
  • Posts: 102

Re: i need to show a form only when a checkbox is ticked

you CAN use jQuery indeed, but you dont NEED to use jQuery, just normal Javascript is fine.

the normal way:

say you have a checkbox, and the form you want to hide/show is contained inside a div with an id="myDiv"

<input type="checkbox" value="myValue" name="myName" onchange="showHide(this)">

<div id="myDiv>
<form name="myForm">
.....
</form>
</div>

then you need a function called showHide that takes an element/object as a paramer -> (this)

<script type="text/javascript">
function showHide(obj)
{
    if(obj.checked){
        // if checkbox is checked then show div with id "myDiv"
        document.getElementById("myDiv").style.display = "block";
    }
    else{
        // otherwise hide div with id "myDiv"
        document.getElementById("myDiv").style.display = "none";
    }
}
</script>
  • Gender: Male
  • From: Chico/Sacramento, CA
  • Registered: 2008-12-19
  • Posts: 2,343

Re: i need to show a form only when a checkbox is ticked

I posted some of the code you would need to use to do this with jQuery. BeeDev is right though -- this could be simply done with regular javascript.

  • Registered: 2009-04-30
  • Posts: 102

Re: i need to show a form only when a checkbox is ticked

Seemed a bit of overkill to include 55kb javascript lib (jQuery) just to hide/show a layer.