Checkbox and JQUERY: "is checked" always FALSE

Question

The code is below and checkbox is always FALSE. But on page it is different. It doesn't get checked or unchecked.

<script type="text/javascript">
 $('.cbOzelHastaAdi').unbind('click');

 $('.cbOzelHastaAdi').click( function() {

    var parentDiv = $(this).parent().get(0);
    var cbs = $(parentDiv).find('table input:checkbox');

   if($(this).attr("checked") === "true") {
        cbs.each(function() { $(this).attr('checked', false); });
    }
    else{
        cbs.each(function() { $(this).attr('checked', true); });
    }

})

</script>

Answer 1

One of the problems was that you had the checked attribute on the span surrounding the top checkbox and label and were binding an event handler to the span, therefore checked will always remain checked on the span.

I have moved the event handlers to the checkbox instead and tidied up the code a bit. Whilst I don't believe there is a problem in constructing your own attributes on HTML elements i.e. a checked attribute on a span element (I think XHTML strict validation fails with them), I don't whether it's considered good practice to do so.

I can see that you are using ASP.NET, based on the ID mangling - you can use server side <%= myControl.ClientID %> to get the mangled id to render in the HTML sent to the client.

Working Example here

   $(function() {     
        $('#rptOzel_ctl00_rptOzelHastalar_ctl00_cbOzelKurumHastasi').unbind('click');
        $('#rptOzel_ctl00_rptOzelHastalar_ctl00_cbOzelKurumHastasi').click( function() {

           var cbs = $('table input:checkbox');  

           if($(this).is(':checked')){
               cbs.each(function() { $(this).attr('checked', true); });
           }
           else{
            cbs.each(function() { $(this).attr('checked', false); });
           }

        });
    });

EDIT:

In response to your comment, you have a couple of options for resolving the clientid. If you write your jQuery in the aspx page, then you can simply use

$('#<%= cbOzelKurumHastasi.ClientID %>')

in place of

$('#rptOzel_ctl00_rptOzelHastalar_ctl00_cbOzelKurumHastasi')

If you have your jQuery in an external script file then you could put this in your aspx page

<script type="text/javascript">
var cbOzelKurumHastasi = '#<%= cbOzelKurumHastasi.ClientID %>';
</script>

and then use the variable in your external script file

$(function() {     
            $(cbOzelKurumHastasi).unbind('click');
            $(cbOzelKurumHastasi).click( function() { ...

For other options take a look at this question and answer - How to stop ASP.NET from changing ids in order to use jQuery

Answer 2

I usually us the .is() functionality of jQuery to check for this

$('.cbOzelHastaAdi').click( function() {
  if($(this).is(':checked')){
    ...
  }else{
    ...
  }
})