php - jQuery - On click, check all checkboxes in class, if checked (do this) if not (then) -


i have php page populated mysql query. want filter table results based on checkboxes selected.

when page loaded results show. on change of checkbox, results filter, hiding or showing rows based on checkboxes checked!

can please me jquery code. have;

$(function() { $(".filtercheck").change(function() {     var checkarr = $('.filtercheck:checked').map(function() {         $ = '.filter_' + this.value;         $($).parents('tr').show();         return this.value;                 }).get();     $.each(checkarr, function(i, val) {         alert('no values');         $v = ".filter_" + val;         $($v).parents('tr').show()     }); });  

can explain how can edit code, if checkbox selected results in table shown ( $(this.value).parents('tr').show() ) or, if checkbox not selected, .hide(), if checkboxes unchecked, results shown..

the checkboxes created php code,

        $db_results = mysqli_query(database::$conn, "select * suppliers ten_id = $tenid order sup_name;");      /* make array suplier types       * build cheklist of types */     echo "<br><h5 class='text-muted'>filter supplier type</h5>";     $db_types = [];     while ($row = mysqli_fetch_array($db_results)) { array_push($db_types, $row['sup_type']); }     sort($db_types);     $db_types = array_unique($db_types);     foreach ($db_types $i) {         echo "<div class='checkbox'>";         $t = strtolower(str_replace(' ', '_', $i));         echo "<label><input type='checkbox' class='filtercheck' value='$t'>$i</label>";         echo "</div>";      } 

this supplier type table, , create checkbox returned value. value of checkbox set returned value, in lower case , replacing white space '_'. table row, , table data fields populated below

            $t = strtolower(str_replace(' ', '_', $row['sup_type']));         echo "<td class='filter_$t'>" . $row['sup_type'] . "</td>"; 

this sets class of td value prefixed 'filter_' when check checkbox, can take value, prefix 'filter_' , show or hide rows type.

open suggestions fix this.

something this

$(function() {      $(".filtercheck").on('change', function() {          var checked = $('.filtercheck:checked'),              trs     = $('[class^="filter_"]').closest('tr');            if (checked.length === 0) { // no boxes checked              trs.show();          } else {              trs.hide();              checked.each(function() {                  $('.filter_' + this.value).closest('tr').show();              });          }      });  });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <h5 class='text-muted'>filter supplier type</h5>  <div class='checkbox'>      <label><input type='checkbox' class='filtercheck' value='test1'>test 1</label>      <label><input type='checkbox' class='filtercheck' value='test2'>test 2</label>      <label><input type='checkbox' class='filtercheck' value='test3'>test 3</label>  </div>  <br /><br />  <table>      <tr><td class='filter_test1'>test1</td></tr>      <tr><td class='filter_test2'>test2</td></tr>      <tr><td class='filter_test3'>test3</td></tr>  </table>


Comments

Popular posts from this blog

php - How to display all orders for a single product showing the most recent first? Woocommerce -

asp.net - How to correctly use QUERY_STRING in ISAPI rewrite? -

angularjs - How restrict admin panel using in backend laravel and admin panel on angular? -