Resolve wrong message during the selection of items by checkbox

In a list page If i checked the header checkbox, system showing wrong message "4 ITEM(S) SELECTED" but there only 3 items present

On a listing page there 3 items are present, but when I select the select all checkbox system showing 4 items is selected. There is a variable "countCheckedCheckboxes" that define the length of the table values. At first, I think if I decremented the countCheckedCheckboxes value 1 then it's OK.

But there is a problem if the counted total length value is always countCheckedCheckboxes -1 then the first checkbox length always be counted as 0(zero).

That why i set a new class on that count the lenght of content.


$(document).ready(function(){
        var checkboxes = $('input[type="checkbox"]'); 
        checkboxes.click(function(){
            var countCheckedCheckboxes = checkboxes.filter(':checked').length;
            if(countCheckedCheckboxes  > 0){
                $('.label_info').text(countCheckedCheckboxes-1+' item(s) selected');            
            }else{
                $('.label_info').text('No item selected');
            } 
        });
    });

    $(".checkSelect").change(function () {
  
    var lenghtCheck= $('input[class="checkSelect"]:checked').filter(':checked').length //that check the length of table content's
           //the variable lenghtCheck that count the length of table content.
            if( lenghtCheck > 0){
                $('.label_info').text(lenghtCheck+' item(s) selected');             
            }else{
                $('.label_info').text('No item selected');
            }
   });

Conclusion:

You can use the code in NodeJS development. Please share your reviews in the comment section. See you on my next blog.

We Serve clients globally in diverse industries

Stay Upto Date With Our Newsletter.