Click here to Skip to main content
12,634,171 members (26,208 online)
Click here to Skip to main content
Add your own
alternative version

Stats

20.5K views
5 bookmarked
Posted

Check/Uncheck all checkboxes in a CheckBoxList

, 15 May 2013 CPOL
Rate this:
Please Sign up or sign in to vote.
Check/Uncheck all checkboxes in a CheckBoxList (one control).

Introduction

I needed a script to check/uncheck all items in a CheckBoxList in a GridView, but all the search led to the use of two controls, one for Select All and the other for the List itself.

Using the Code

I'll assume that the CheckBoxList already has its items. We will add an attribute to each checkbox in the CheckBoxList.

C#

foreach (ListItem item in chkList.Items)
{
    item.Attributes.Add("onclick", "CheckStatus(this)");
    item.Selected = true;
} 

JavaScript

function CheckStatus(chk) {
            $(document).ready(
            function () {
                var chkList = $($(chk).parents('table')).first();
                var firstCHK = $(chkList).find(':checkbox').first();
                var txtControl = $($(chkList).parents('div').first().
                	parents('td').first().find(':text')).first();
                var txt = '';
                if ($(firstCHK).attr('value') == 0) {
                    if ($(firstCHK).attr('value') == $(chk).attr('value')) {
                        $(chkList).find(':checkbox').each(function () {
                            this.checked = $(firstCHK).is(':checked');
                        });
                        if ($(firstCHK).is(':checked')) {
                            txt = 'All';
                        }
                        else {
                            txt = 'None';
                        }
                    }
                    else {
                        var countAll = $($(chkList).find(':checkbox')).length;
                        var countFalse = 0;
                        var countTrue = 0;
                        if ($(chk).is(':checked') == false) {
                            $(firstCHK).attr('checked', false);
                        }
                        else {
                            var flag = true;
                            $(chkList).find(':checkbox').each(function () {
                                if (this.checked == false && this.value != 0)
                                    flag = false;
                            });
                            $(firstCHK).prop('checked', flag);
                        }
                        $(chkList).find(':checkbox').each(function () {
                            if (this.checked == false && this.value != 0)
                                countFalse += 1;
                            else if (this.checked && this.value != 0)
                                countTrue += 1;
                        });
                        if (countFalse == countAll - 1)
                            txt = 'None';
                        else if (countTrue == countAll - 1)
                            txt = 'All';
                        else {
                            $(chkList).find(':checkbox').each(function () {
                                if (this.checked && this.value != 0)
                                    txt = txt.length == 0 ? $('label[for=' + 
                                    this.id + ']').html() : txt + ',' + 
                                    $('label[for=' + this.id + ']').html();
                            });
                        }
                    }
                }
                $(txtControl).val(txt);
                $(txtControl).prop('title', txt);
            });
        } 

Update

I have updated the JavaScript to write the selected Checkbox names in the TextBox.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Share

About the Author

Tamer G. Ahmed
Software Developer (Senior)
Saudi Arabia Saudi Arabia
A Senior Software Developer working in KSA-Riyadh, love to code and to explore other code

You may also be interested in...

Comments and Discussions

 
-- There are no messages in this forum --
| Advertise | Privacy | Terms of Use | Mobile
Web02 | 2.8.161208.2 | Last Updated 15 May 2013
Article Copyright 2013 by Tamer G. Ahmed
Everything else Copyright © CodeProject, 1999-2016
Layout: fixed | fluid