CODEWITHSUNDEEP
jquery
etm124
etm124

Reputation: 2140

Showing a DIV if a checkbox is UNchecked

I am trying to show a div if a checkbox is unchecked, and hide if it is checked. I have this, but I seem to be missing something:

http://jsfiddle.net/XyUWV/8/

HTML:

<input name="billing_check" id="billing_check" type="checkbox" class="billing_check" size="40"  checked="checked"/>

<div class="registration_box01 showme">
          <div class="title">
            <h4>billing information - infomration associated with your credit card<br />
            </h4>
          </div>
</div>

Javascript:

$("input[name='billing_check']").change(function() {
  (".showme").toggle($("input[name='mycheckboxes']:checked").length>0);
});

Style:

.showme{
    display:none;
}

Upvotes: 0

Views: 185

Answers (4)

Uchenna Nwanyanwu
Uchenna Nwanyanwu

Reputation: 3204

You can do this, though not tested

$("#billing_check").click(function()
{
    if(this.checked)
    {
        $(".registration_box01").hide();
    }else
    { 
        $(".registration_box01").show();
   }
});

Upvotes: 0

yckart
yckart

Reputation: 33408

Like Felix Kling said, you need to set $ before a jquery function. But the main mistake was the false input name mycheckboxes name it to billing_check will work.

HTML

<input name="billing_check" id="billing_check" type="checkbox" class="billing_check" size="40"  checked="checked"/>

<div class="registration_box01 showme">
  <div class="title">
    <h4>billing information - infomration associated with your credit card<br />
    </h4>
  </div>
</div>

​

CSS

.showme{
    display:none;
}

​

JS

$('#billing_check').change(function() {     
    $('.registration_box01').toggle(!$(this).is(':checked'));
});

​

DEMO

Upvotes: 1

Richard
Richard

Reputation: 8280

I think you might be checking against the wrong checkbox, should mycheckboxes be billing_check. Also, instead of .length, you could check against .is(':checked'), like this:

$('#billing_check').change(function() {     
    $('.showme').toggle(!$(this).is(':checked'));
});

jsFiddle demo

Upvotes: 1

Matt
Matt

Reputation: 156

I'd reference that checkbox by id, and use .is(":checked")

http://jsfiddle.net/XyUWV/12/

Upvotes: 0

Related Questions