How do I count checked checkboxes across all pages of a gridview using jquery?

Question

I want to instantly update a status line indicating the number of checked checkboxes across all pages of an asp.net gridview. Right now I am only ably to count the number of checkboxes that are checked on the current gridview page.

Here is my code.

$(document).ready(initAll);

function initAll(){ countChecked(); $(".activeBoxes").click(countChecked); }

function countChecked() {

  var n = $(".activeBoxes input:checked").length;
  $("#checkboxStatus").text(n + (n == 1 ? " vehicle is" : " vehicles are") + " selected on this page.  ");
  if( n == 0){
       $(".activateButton").hide();
       $("#checkboxStatus").hide();

  }else{
    $("#checkboxStatus").show();
    $(".activateButton").show();
  }

}

Answer 1

You can track the total selection in viewstate (or something similar) on page change. I did something similar tracking the selected row ID's in an array. In my case I had to re-check the items when they returned to the page. Additionally if you allow sorting the selection may move across pages.

Edit: Sorry this doesn't actually your Jquery question, but maybe it will help...

Answer 2

I am using a viewstate to keep track of all checked items across all pages and rechecking them upon returning to the page.

I will have to add my viewstate value to the page total and somehow subtract overlapping totals. Since my jquery does not include an id, this will be tricky.

protected ArrayList savedIds; if (ViewState["SavedIds"] == null) savedIds = new ArrayList(); else savedIds = (ArrayList)ViewState["SavedIds"];

List activateList = new List();

    foreach (GridViewRow tt in GridView2.Rows)
    {
        CheckBox cb = (CheckBox)tt.FindControl("ActivateItem");
        HiddenField id = (HiddenField)tt.FindControl("IdField");
        if (cb.Checked)
        {
            int tempId = 0;
            string tempId2 = id.Value.ToString();
            int.TryParse(tempId2, out tempId);
            activateList.Add(tempId);
        }

    }
    foreach (int activateId in activateList)
    {
        if (!savedIds.Contains(activateId.ToString())) savedIds.Add(activateId.ToString());
    }
    ViewState["SavedIds"] = savedIds;

Answer 3

What you're missing is removing the ID. When checking rows and tempid is not checked make sure it is not in saveids.

Answer 4

I have the code that removes unchecked boxes from the list. I could have included that code as well, but my question is about counting checkboxes across all pages of a gridview and updating the status instantly without page reload.

Answer 5

Keep a hidden text field on your page and everytime you check a box, call a javascript method that will write the 'id' of the checkbox to the hidden field. Each time you postback your page, serialise the hidden field's value to the session in your desired objects structure (be it objects, hash table, array etc).

Upon rendering the page, each checkbox can check the session object structure (that you have created before) and determine if the state of the checkbox was last checked or not.

You could use JQuery to loop through all checkboxes on the page and increment a counter if the checkbox is checked.