0

i am passing the class and id of chechboxes to the js function and try to make it dynamic to work for id and class of any checkbox to check all and uncheck all check boxes here is the html

    <input type="checkbox" name="reply_status[]" <?=$checked;?>  class="memebers" value="<?=$status[$e]['mail_sent_id']?>">
            </td>
            <td>
                <input type="checkbox" name="send_invoice[]" <?=$checked_send_invoice;?>  class="send_invoice" value="<?=$status[$e]['mail_sent_id']?>">
            </td>
            <td>
                <input type="checkbox" name="invoice_paid[]" <?=$checked_invoice_paid;?>  class="invoice_paid" value="<?=$status[$e]['mail_sent_id']?>">
            </td>

<td>
         <input type="checkbox" id="check_all_re" name="check_all" onclick="checkall_members('memebers','check_all_re')">&nbsp;&nbsp;&nbsp;&nbsp;
                Check All
            </td>
            <td>
                <input type="checkbox" id="check_all_sv" name="check_all" onclick="checkall_members('send_invoice','check_all_sv')">&nbsp;&nbsp;&nbsp;&nbsp;
                Check All
            </td>
            <td>
                <input type="checkbox" id="check_all_ip" name="check_all" onclick="checkall_members('invoice_paid','check_all_ip')">&nbsp;&nbsp;&nbsp;&nbsp;
                Check All
            </td>

and here is the js function

<script type="text/javascript">
function checkall_members(chechboxclass, chechboxid) {
    // var id = document.getElementById("check_all");
    alert();
    chechboxid = $('#' + chechboxid);
    chechboxclass = $('.' + chechboxclass);
    if (chechboxid.checked) {
        chechboxclass.attr('checked', 'checked');
    }
    else {
        chechboxclass.removeAttr('checked');
    }
}

any help would be appreciated

4
  • What are you trying to do, what does it do, and what do you expect it to do? Commented May 11, 2012 at 11:28
  • Do not use .attr() to set the checked state. use .prop('checked', true_or_false). Also, to get the state you use .prop('checked') - jQuery objects do not have a .checked property. Commented May 11, 2012 at 11:29
  • Can you add your javascript code that binds check all_members to actions on the page? If it is not binded to an action, what actually calls the function? Commented May 11, 2012 at 11:30
  • 2
    Do not use inline event handlers add them with jQuery! Commented May 11, 2012 at 11:31

2 Answers 2

3

Replace your if..else block with the following.

chechboxclass.prop('checked', chechboxid.prop('checked'));

By the way, it's checkbox and not chechbox.

To improve your code even more, get rid of the inline events:

$('input[name="check_all"]').on('change', function() {
    $($(this).data('toggleAll')).prop('checked', this.checked);
});

Now you just need to add data-toggle-all=".send_invoice" etc. to those checkboxes. The param value should be the selector of the checkboxes you want to toggle with that checkbox.

If you have all the name="check_all" elements a class, you could also speed up the selector by using input.whatever_class instead of input[name="check_all"]

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

Comments

0

i have sorted out the simplest solution for my problem that is

 <script type="text/javascript">

function checkall_members(chechboxclass, chechboxid) {

    var checkbox = document.getElementById(chechboxid);
    chechboxclass = $('.' + chechboxclass);

    if (checkbox.checked) {
        chechboxclass.attr('checked', 'checked');
    }
    else {

        chechboxclass.removeAttr('checked');
    }
}
 </script>

i have to get the id elememt within same library of javascript thats why it was not working var checkbox = document.getElementById(chechboxid); thanks guys for helping me

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.