Given a checkbox object output its value

Question

I have a page that has a number of checkboxes in it. I would like to write a function that will be called when the ckeckbox is clicked, that determines if the checkbox is checked or not.

<input type="checkbox" onclick="toggleVis('id',   this);"/> ID
<input type="checkbox" onclick="toggleVis('edit', this);" checked="checked"/> Edit
<input type="checkbox" onclick="toggleVis('last', this);"/> Last

Note some checkboxes start checked.

I figured that there must be a way to do this based on a reference passed, so I passed the this value as a parameter.

function toggleVis(name, checkbox)
{
    //if(checkbox.checked())
        console.log('checked');

        if($('.'+name).css('display') != "none")
            $('.'+name).css('display', 'none');
        else
             $('.'+name).css('display', 'table-cell');
}

I am open to use jQuery.

Did your code work? If not what happened? Get Firebug and see what the objects passed actually are. — OrangeDog
– OrangeDog, Commented Dec 15, 2010 at 14:35

user113716 · Accepted Answer · 2010-12-15 14:34:37Z

1

You were close.

if(checkbox.checked) {
    console.log('checked');
    //...
}

There's no checked() method, but there is a checked property. Note that your code may only work on clicks. Perhaps onchange would be better?

answered Dec 15, 2010 at 14:34

user113716

323k64 gold badges454 silver badges441 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Brad Christie · Accepted Answer · 2010-12-15 14:34:54Z

1

Look at the checkboxobj.checked property (instead of calling it like a function). In your case, you could reference if (checkbox.checked) { ... }. More information can be found on this website

answered Dec 15, 2010 at 14:34

Brad Christie

102k16 gold badges160 silver badges200 bronze badges

Comments

sioked · Accepted Answer · 2010-12-15 14:40:56Z

1

If you wanted to do this with jQuery you might try the following. Note that I'm binding to the checkbox instead of including the 'onclick' or 'onchange' directly on the HTML element.

$('[type=checkbox]').click(function(){
  if( $(this).attr('checked') ){
    console.log('checked');
    if($('.'+$(this).attr('name')).css('display') != "none") {
      $('.'+$(this).attr('name')).css('display', 'none');
    } else {
      $('.'+$(this).attr('name')).css('display', 'table-cell');
    }
  }
});

answered Dec 15, 2010 at 14:40

sioked

2261 silver badge4 bronze badges

Comments

Kos · Accepted Answer · 2010-12-15 14:36:46Z

0

And a JQuery-based solution:

var checked = $(checkbox).is(':checked');

Helpful if you want to find the checkbox first by some JQ selector.

answered Dec 15, 2010 at 14:36

Kos

72.7k28 gold badges174 silver badges239 bronze badges

Comments

PeeHaa · Accepted Answer · 2010-12-15 14:37:47Z

0

<input type="checkbox" class="checkthis"> ID
<input type="checkbox" class="checkthis" checked="checked"> Edit
<input type="checkbox" class="checkthis"> Last

$(input.checkthis).click(function() {
  if($(this).is(':checked') {
    // do checked stuuf
  } else {
    // do not checked stuff
  }
});

answered Dec 15, 2010 at 14:37

PeeHaa

73.1k60 gold badges195 silver badges265 bronze badges

Collectives™ on Stack Overflow

Given a checkbox object output its value

5 Answers 5

Comments

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related