CODEWITHSUNDEEP
phphtmlcheckbox
Koray Ballı
Koray Ballı

Reputation: 99

Counting Number Of Selected Checkbox & Checking all

Im bringing values from my Database.As you know,sometimes you want to check multiple rows to delete or update.And you would like to know how much did you selected.

What I need is:

-- Number of selected checkboxes -- Checking all checkboxes using one checkbox

Here is how I can loop multiple checkbox es without any function:

if(isset($_POST['Submit']))
{
  echo '<table id="registrations_table_results" border=1  align=center >
  <thead style="font-weight:bold;">
    <tr>
        <td><input type="checkbox" name="checkall"></td>
        <td>#</td>
        <td>Name Surname</td>
        <td>Unique ID</td>
    </tr>
  </thead>';    

    $adsoyad = $_POST['adsoyad'];
    $query = mysqli_query($connect,"select * from kullanicilar where adsoyad like '%$adsoyad%'");


    while ($read = mysqli_fetch_array($query))
    {       
        $id = $read['ID'];
        $adsoyad = $read['adsoyad'];
        $tc = $read['tc'];

        echo '
            <tr>
                <td><input type="checkbox" name="check"></td>
                <td>'.$id.'</td>
                <td>'.$adsoyad.'</td>
                <td>'.$tc.'</td>
            </tr>
            ';
    }
  }

Here how looks like:

problem At this point as you can see,there are checkbox es near each result when clicked the search button.And 1 at the table header to check all.I have tried multiple of functions there but they seemed to not work.I decided to copy-paste the work of mine here ,So it would be better to fit the function I needed here.

EDIT:Those checkboxes were not created by hand manually.But it does as much as numbers of rows.

Upvotes: 0

Views: 2358

Answers (1)

Allan Empalmado
Allan Empalmado

Reputation: 943

Added a sample code with check all, and check count on checkbox change in jQuery see the code below: It also gets the output of an uncheck checkbox. 

$(document).ready(function(){
        //Checkbox check event
        $("input[type='checkbox']").on("change", function(){
               //update count every check change event
               //total of all check[] checked
               var checkedcount = $("input[name='check[]']:checked").length;
           console.log("Total checked items" + checkedcount);
          //Check values of all check[]
          setTimeout(function(){
          var checkboxes = $("input[name='check[]']");
          $.each(checkboxes , function(index, element){
                //check if the current checkbox is checked
                var ischecked = $(checkboxes[index]).is(":checked") ? true : false;
                 //sample output
                 console.log(index + " value=" + element.value + " / ischecked? =" + ischecked);
             });
          });

        });
  
        $("input[name='checkall']").on("change", function(){
            if ( $("input[name='checkall']:checked" ) ) {
             $("input[name='check[]']").not(this).prop('checked', this.checked);
            }
        }).trigger("onchange");
    });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tr>
   <td><input type="checkbox" name="checkall"> Check all</td>
</tr>
 <tr>
   <td><input type="checkbox" name="check[]" value="number one">1</td>
</tr>
 <tr>
   <td><input type="checkbox" name="check[]" value="number two">2</td>
</tr>
 <tr>
   <td><input type="checkbox" name="check[]" value="number three">3</td>
</tr>
 <tr>
   <td><input type="checkbox" name="check[]" value="number four">4</td>
</tr>
 <tr>
   <td><input type="checkbox" name="check[]" value="number five">5</td>
</tr>
  </table>

First you need to rename your checkbox to something like below:

<td><input type="checkbox" name="check[]"></td>

On Submit you could do :

$checkboxes = $_POST['check'];
$cbCount = count($checkboxes);

To check each checkboxes values in php

foreach($checkboxes as $checkbox) {
   // some code here

}

count checked items in jQuery on check change

$(document).ready(function(){
    $("input[name='check[]']").on("change", function(){
           //update count every check change event
           var count = $("input[name='check[]']:checked").length;
    });
});

Upvotes: 1

Related Questions