title: Make checkboxes filter using post or queries
body: <pre><code>&lt;?php 
  
  require "../connection.php";
  
  
  
  $query= "Select * from meals where is_active= '1' AND category ='entree' ";
  $result=mysqli_query($conn,$query);
  
  $query11= "Select * from meals where is_active= '1' AND category ='soup' ";
  $result11=mysqli_query($conn,$query11);
  
  
  $query21= "Select * from meals where is_active= '1' AND category ='bowl' ";
  $result21=mysqli_query($conn,$query21);
  
  
  $query31= "Select * from meals where is_active= '1' AND category ='salad' ";
  $result31=mysqli_query($conn,$query31);     
  
  $filters= "select * from meals LEFT JOIN meal_options ON meals.id = meal_options.meal_id LEFT JOIN main_filters ON meal_options.id = main_filters.meal_options_id where main_filters.vegan = 'N'";
  $result_filter=mysqli_query($conn,$filters); ///THIS IS HOW I FILTER
  
  ?&gt;
  &lt;!DOCTYPE html&gt;
  &lt;html lang="en"&gt;
  &lt;head&gt;
  &lt;link rel="stylesheet" href="../assets/css/style.css?v=&lt;?php echo rand();?&gt;"&gt;
  &lt;link rel="stylesheet" href="../assets/css/fonts.css"&gt;
  &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt;
  &lt;link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.css"&gt; 
  &lt;link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"&gt;
  &lt;/head&gt;
  &lt;body&gt;
  
  &lt;div class="pageContent"&gt;
  
      &lt;div id="OrderContainer"&gt;
          &lt;div&gt;
      &lt;div id="OrderGetStarted1" class="new1" style="height:0px"&gt;
          &lt;div class="started"&gt;
              &lt;span class="block"&gt;
                  &lt;h1 class="textCenter OldStandard fontt"&gt;Hi &lt;?php echo $firstname?&gt;, Now comes the fun part!&lt;/h1&gt;
          &lt;/span&gt;
          &lt;/div&gt;
          &lt;/div&gt;
  
  &lt;div class="row rowing"&gt;
  &lt;form method="post"&gt;
    &lt;div class="col-6 col-md-3 checkbox-rounds" id="filter-checks"&gt;
    &lt;p class="orange OldStandard"&gt; Menu Filters&lt;/p&gt;
    &lt;a type="button" class="check orange pointer OldStandard"&gt;Select All &lt;/a&gt;
    &lt;br&gt;
    &lt;a type="button" class="uncheck orange pointer OldStandard"&gt; Unselect All&lt;/a&gt;
    &lt;br&gt;
          &lt;input type="checkbox" class="checkbox-round" value="vegan" id="vegan" checked/&gt;&lt;label for="vegan" class="OldStandard"&gt;&lt;span&gt;&lt;i class="fa fa-circle"&gt;&lt;/i&gt;&lt;i class="fa fa-check" &gt;&lt;/i&gt;&lt;/span&gt;Vegan&lt;/label&gt;
          &lt;br/&gt;
          &lt;input type="checkbox" class="checkbox-round" value="vegetarian" id="vegetarian" checked/&gt; &lt;label for="vegetarian" class="OldStandard"&gt;&lt;span&gt;&lt;i class="fa fa-circle"&gt;&lt;/i&gt;&lt;i class="fa fa-check" &gt;&lt;/i&gt;&lt;/span&gt;Vegetarian&lt;/label&gt;
          &lt;br/&gt;
          &lt;input type="checkbox" class="checkbox-round" value="pescetarian" id="pescetarian" checked/&gt; &lt;label for="pescetarian" class="OldStandard"&gt;&lt;span&gt;&lt;i class="fa fa-circle"&gt;&lt;/i&gt;&lt;i class="fa fa-check" &gt;&lt;/i&gt;&lt;/span&gt;Pescetarian&lt;/label&gt;
           &lt;br/&gt;
          &lt;input type="checkbox" class="checkbox-round" value="dairy-free" id="dairy-free" checked/&gt; &lt;label for="dairy-free" class="OldStandard"&gt;&lt;span&gt;&lt;i class="fa fa-circle"&gt;&lt;/i&gt;&lt;i class="fa fa-check" &gt;&lt;/i&gt;&lt;/span&gt;Dairy-free&lt;/label&gt;
           &lt;br/&gt;
          &lt;input type="checkbox" class="checkbox-round" value="egg-free" id="egg-free" checked/&gt; &lt;label for="egg-free" class="OldStandard"&gt;&lt;span&gt;&lt;i class="fa fa-circle"&gt;&lt;/i&gt;&lt;i class="fa fa-check" &gt;&lt;/i&gt;&lt;/span&gt;Egg-free&lt;/label&gt;
           &lt;br/&gt;
          &lt;input type="checkbox" class="checkbox-round" value="fish-free" id="fish-free" checked/&gt; &lt;label for="fish-free" class="OldStandard"&gt;&lt;span&gt;&lt;i class="fa fa-circle"&gt;&lt;/i&gt;&lt;i class="fa fa-check" &gt;&lt;/i&gt;&lt;/span&gt;Fish-free&lt;/label&gt;
           &lt;br/&gt;
          &lt;input type="checkbox" class="checkbox-round" value="shellfish" id="shellfish" checked/&gt; &lt;label for="shellfish" class="OldStandard"&gt;&lt;span&gt;&lt;i class="fa fa-circle"&gt;&lt;/i&gt;&lt;i class="fa fa-check" &gt;&lt;/i&gt;&lt;/span&gt; Shellfish-free&lt;/label&gt;
            &lt;br/&gt;
          &lt;input type="checkbox" class="checkbox-round" value="tree" id="tree" checked/&gt; &lt;label for="tree" class="OldStandard"&gt;&lt;span&gt;&lt;i class="fa fa-circle"&gt;&lt;/i&gt;&lt;i class="fa fa-check" &gt;&lt;/i&gt;&lt;/span&gt;Tree nut-free&lt;/label&gt;
            &lt;br/&gt;
          &lt;input type="checkbox" class="checkbox-round" value="peanut" id="peanut" checked/&gt; &lt;label for="peanut" class="OldStandard"&gt;&lt;span&gt;&lt;i class="fa fa-circle"&gt;&lt;/i&gt;&lt;i class="fa fa-check" &gt;&lt;/i&gt;&lt;/span&gt;Peanut-free&lt;/label&gt;
            &lt;br/&gt;
          &lt;input type="checkbox" class="checkbox-round" value="soy" id="soy" checked/&gt; &lt;label for="soy" class="OldStandard"&gt;&lt;span&gt;&lt;i class="fa fa-circle"&gt;&lt;/i&gt;&lt;i class="fa fa-check" &gt;&lt;/i&gt;&lt;/span&gt; Soy-free&lt;/label&gt;
            &lt;br/&gt;
          &lt;input type="checkbox" class="checkbox-round" value="total-fat" id="total-fat" checked/&gt; &lt;label for="total-fat" class="OldStandard"&gt;&lt;span&gt;&lt;i class="fa fa-circle"&gt;&lt;/i&gt;&lt;i class="fa fa-check" &gt;&lt;/i&gt;&lt;/span&gt; Low Total Fat&lt;/label&gt;
            &lt;br/&gt;
          &lt;input type="checkbox" class="checkbox-round" value="saturated-fat" id="saturated-fat" checked/&gt; &lt;label for="saturated-fat" class="OldStandard"&gt;&lt;span&gt;&lt;i class="fa fa-circle"&gt;&lt;/i&gt;&lt;i class="fa fa-check" &gt;&lt;/i&gt;&lt;/span&gt;Low Saturated Fat&lt;/label&gt;
            &lt;br/&gt;
          &lt;input type="checkbox" class="checkbox-round" value="cholesterol" id="cholesterol" checked/&gt; &lt;label for="cholesterol" class="OldStandard"&gt;&lt;span&gt;&lt;i class="fa fa-circle"&gt;&lt;/i&gt;&lt;i class="fa fa-check" &gt;&lt;/i&gt;&lt;/span&gt;Low Cholesterol&lt;/label&gt;
            &lt;br/&gt;
          &lt;input type="checkbox" class="checkbox-round" value="sodium" id="sodium" checked/&gt; &lt;label for="sodium" class="OldStandard"&gt;&lt;span&gt;&lt;i class="fa fa-circle"&gt;&lt;/i&gt;&lt;i class="fa fa-check" &gt;&lt;/i&gt;&lt;/span&gt;Low Sodium&lt;/label&gt;
            &lt;br/&gt;
          &lt;input type="checkbox" class="checkbox-round" value="protein" id="protein" checked/&gt; &lt;label for="protein" class="OldStandard"&gt; &lt;span&gt;&lt;i class="fa fa-circle"&gt;&lt;/i&gt;&lt;i class="fa fa-check" &gt;&lt;/i&gt;&lt;/span&gt;Protein &amp;#62;25g&lt;/label&gt;
            &lt;br/&gt;
          &lt;input type="checkbox" class="checkbox-round" value="calories" id="calories" checked/&gt; &lt;label for="calories" class="OldStandard"&gt;&lt;span&gt;&lt;i class="fa fa-circle"&gt;&lt;/i&gt;&lt;i class="fa fa-check" &gt;&lt;/i&gt;&lt;/span&gt;Calories  &amp;#60;450 calories&lt;/label&gt;
          &lt;br&gt;
  
    &lt;/div&gt;
  &lt;/form&gt;
  
      &lt;div class="col col-md-9" id="display_menu" style="margin-left:-80px;"&gt;
      &lt;p class="orange OldStandard pull-left title_menu"&gt;Soups &lt;/p&gt;  
          &lt;button  class="disabled1 white cbtn1 pull-right" type="submit" id="submit" &gt;Checkout  &lt;i class="fa fa-long-arrow-right"&gt;&lt;/i&gt;&lt;/button&gt;
  
  
  
          &lt;div class= "flex rowWrap foodDiv"&gt;
  
  &lt;?php while($row11 = mysqli_fetch_assoc($result11)) {
      $name1=$row11['name'];
      $subtitle1=$row11['subtitle'];
      $image1=$row11['image_url'];
      $thumbnail1=$row11['thumb_url'];
      $meal_id1 = $row11['id'];
  
      $query12="select * from meal_options where meal_id = '$meal_id1'";
      $result12=mysqli_query($conn,$query12);
  
  
      $labels1=array();
      $prices1 =array();
      while($row12 = mysqli_fetch_assoc($result12))
      {
          $label1= $row12['label'];
          $labels1[]= $label1;
  
          $price1= $row12['price'];
          $price1 = number_format($price1/100, 2);
          $price1 = "$" . $price1;
          $prices1[]= $price1;
  
      }
  
      $labels1=implode(" | ",$labels1);
      //$prices1 = implode(" - ", $prices1);
      $firstEle = $prices1[0];
      $lastEle = $prices1[count($prices1) - 1];
      //echo $firstEle ."-". $lastEle;die;
  
  ?&gt;
  
                  &lt;span class="deliveryItem satin pointer vertical-top textCenter"&gt;
                   &lt;img src="&lt;?php echo $image1; ?&gt;" width="250px" height= "200px;" class="foodImage"&gt;
                  &lt;div class="menuDelivery"&gt;
                  &lt;h3 class= "textCenter OldStandard dark-orange font1"&gt; &lt;?php echo $name1;?&gt; &lt;/h3&gt;
                  &lt;p class= "OldStandardItalic text-black font2"&gt; &lt;?php echo $subtitle1;?&gt; &lt;/p&gt;
                  &lt;hr&gt;
                  &lt;span class="open_sansbold text-black"&gt;
                  &lt;?php   if(count($prices1) &gt; 1){print_r($firstEle ."-". $lastEle);}
                  else{ print_r($price1);}
                  ?&gt;
                  &lt;br&gt;
                  &lt;/span&gt;
                  &lt;span class="text-black font2"&gt;
                  &lt;?php if(mysqli_num_rows($result12) &gt;= 1){echo @$labels1;}  ?&gt;
  
                  &lt;br&gt;
                  &lt;/span&gt;
                  &lt;button  class="view white cbtn1 open_sansbold"&gt;View/Add&lt;/button&gt;
                  &lt;/div&gt;
                  &lt;/span&gt;
  
  
                  &lt;?php }?&gt;
          &lt;/div&gt;  
  
  
              &lt;p class="orange OldStandard pull-left title_menu"&gt;Bowls&lt;/p&gt;  
  
                  &lt;div class= "flex rowWrap foodDiv"&gt;
  
  &lt;?php while($row21 = mysqli_fetch_assoc($result21)) {
      $name21=$row21['name'];
      $subtitle21=$row21['subtitle'];
      $image21=$row21['image_url'];
      $thumbnail21=$row21['thumb_url'];
      $meal_id21 = $row21['id'];
  
      $query22="select * from meal_options where meal_id = '$meal_id21'";
      $result22=mysqli_query($conn,$query22);
  
      $labels22=array();
      $prices22 =array();
      while($row22 = mysqli_fetch_assoc($result22))
      {
          $label22= $row22['label'];
          $labels22[]= $label22;
  
          $price22= $row22['price'];
          $price22 = number_format($price22/100, 2);
          $price22 = "$" . $price22;
          $prices22[]= $price22;
  
      }
      $labels22=implode(" | ",$labels22);
      //$prices22 = implode(" - ", $prices22);
      $firstEle22 = $prices22[0];
      $lastEle22 = $prices22[count($prices22) - 1];
  
  
  ?&gt;
  
                  &lt;span class="deliveryItem satin pointer vertical-top textCenter"&gt;
                   &lt;img src="&lt;?php echo $image21; ?&gt;" width="250px" height= "200px;" class="foodImage"&gt;
                  &lt;div class="menuDelivery"&gt;
                  &lt;h3 class= "textCenter OldStandard dark-orange font1"&gt; &lt;?php echo $name21;?&gt; &lt;/h3&gt;
                  &lt;p class= "OldStandardItalic text-black font2"&gt; &lt;?php echo $subtitle21;?&gt; &lt;/p&gt;
                  &lt;hr&gt;
                  &lt;span class="open_sansbold text-black"&gt;
                  &lt;?php if(count($prices22) &gt; 1){print_r($firstEle22 ."-". $lastEle22);}
                  else{ print_r($price22);}?&gt;
                  &lt;br&gt;
                  &lt;/span&gt;
                  &lt;span class="text-black font2"&gt;
                  &lt;?php if(mysqli_num_rows($result22) &gt;= 1){echo @$labels22;}  ?&gt;
  
                  &lt;br&gt;
                  &lt;/span&gt;
                  &lt;button  class="view white cbtn1 open_sansbold"&gt;View/Add&lt;/button&gt;
                  &lt;/div&gt;
                  &lt;/span&gt;
  
  
                  &lt;?php }?&gt;
          &lt;/div&gt;
  
  
  
  
  
  &lt;p class="orange OldStandard pull-left title_menu"&gt;Salad&lt;/p&gt;  
  
                  &lt;div class= "flex rowWrap foodDiv"&gt;
  
  &lt;?php while($row31 = mysqli_fetch_assoc($result31)) {
      $name31=$row31['name'];
      $subtitle31=$row31['subtitle'];
      $image31=$row31['image_url'];
      $thumbnail31=$row31['thumb_url'];
      $meal_id31 = $row31['id'];
  
      $query32="select * from meal_options where meal_id = '$meal_id31'";
      $result32=mysqli_query($conn,$query32);
  
      $labels32=array();
      $prices32 =array();
      while($row32 = mysqli_fetch_assoc($result32))
      {
          $label32= $row32['label'];
          $labels32[]= $label32;
  
          $price32= $row32['price'];
          $price32 = number_format($price32/100, 2);
          $price32 = "$" . $price32;
          $prices32[]= $price32;
  
      }
      $labels32=implode(" | ",$labels32);
      //$prices32 = implode(" - ", $prices32);
      $firstEle32 = $prices32[0];
      $lastEle32 = $prices32[count($prices32) - 1];
  
  
  ?&gt;
  
                  &lt;span class="deliveryItem satin pointer vertical-top textCenter"&gt;
                   &lt;img src="&lt;?php echo $image31; ?&gt;" width="250px" height= "200px;" class="foodImage"&gt;
                  &lt;div class="menuDelivery"&gt;
                  &lt;h3 class= "textCenter OldStandard dark-orange font1"&gt; &lt;?php echo $name31;?&gt; &lt;/h3&gt;
                  &lt;p class= "OldStandardItalic text-black font2"&gt; &lt;?php echo $subtitle31;?&gt; &lt;/p&gt;
                  &lt;hr&gt;
                  &lt;span class="open_sansbold text-black"&gt;
                  &lt;?php if(count($prices32) &gt; 1){print_r($firstEle32 ."-". $lastEle32);}
                  else{ print_r($price32);}?&gt;
                  &lt;br&gt;
                  &lt;/span&gt;
                  &lt;span class="text-black font2"&gt;
                  &lt;?php if(mysqli_num_rows($result32) &gt;= 1){echo @$labels32;}  ?&gt;
  
                  &lt;br&gt;
                  &lt;/span&gt;
                  &lt;button  class="view white cbtn1 open_sansbold"&gt;View/Add&lt;/button&gt;
                  &lt;/div&gt;
                  &lt;/span&gt;
  
  
                  &lt;?php }?&gt;
          &lt;/div&gt;
  
  
  
  
  
  
  
  
  
  
          &lt;p class="orange OldStandard pull-left title_menu"&gt;Entr&amp;#233;es&lt;/p&gt;  
  
                  &lt;div class= "flex rowWrap foodDiv"&gt;
  
  &lt;?php while($row = mysqli_fetch_assoc($result)) {
      $name=$row['name'];
      $subtitle=$row['subtitle'];
      $image=$row['image_url'];
      $thumbnail=$row['thumb_url'];
      $meal_id = $row['id'];
  
      $query2="select * from meal_options where meal_id = '$meal_id'";
      $result2=mysqli_query($conn,$query2);
  
      $labels=array();
      $prices =array();
      while($row2 = mysqli_fetch_assoc($result2))
      {
          $label= $row2['label'];
          $labels[]= $label;
  
          $price= $row2['price'];
          $price = number_format($price/100, 2);
          $price = "$" . $price;
          $prices[]= $price;
  
      }
      $labels=implode(" | ",$labels);
      //$prices = implode(" - ", $prices);
      $firstEle1 = $prices[0];
      $lastEle1 = $prices[count($prices) - 1];
  
  
  ?&gt;
  
                  &lt;span class="deliveryItem satin pointer vertical-top textCenter"&gt;
                   &lt;img src="&lt;?php echo $image; ?&gt;" width="250px" height= "200px;" class="foodImage"&gt;
                  &lt;div class="menuDelivery"&gt;
                  &lt;h3 class= "textCenter OldStandard dark-orange font1"&gt; &lt;?php echo $name;?&gt; &lt;/h3&gt;
                  &lt;p class= "OldStandardItalic text-black font2"&gt; &lt;?php echo $subtitle;?&gt; &lt;/p&gt;
                  &lt;hr&gt;
                  &lt;span class="open_sansbold text-black"&gt;
                  &lt;?php if(count($prices) &gt; 1){print_r($firstEle1 ."-". $lastEle1);}
                  else{ print_r($price);};?&gt;
                  &lt;br&gt;
                  &lt;/span&gt;
                  &lt;span class="text-black font2"&gt;
                  &lt;?php if(mysqli_num_rows($result2) &gt;= 1){echo @$labels;}  ?&gt;
  
                  &lt;br&gt;
                  &lt;/span&gt;
                  &lt;button  class="view white cbtn1 open_sansbold"&gt;View/Add&lt;/button&gt;
                  &lt;/div&gt;
                  &lt;/span&gt;
  
  
                  &lt;?php }?&gt;
          &lt;/div&gt;  
  
  
      &lt;/div&gt;
  &lt;/div&gt;
          &lt;/div&gt;
  
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;script src="http://code.jquery.com/jquery.js"&gt;&lt;/script&gt;
  &lt;link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"&gt;
  &lt;script&gt;
  $(document).ready(function() {
      $('.check').click(function() {
            $('input[type="checkbox"]').prop("checked", true);
          });
  
          $('.uncheck').click(function() {
            $('input:checkbox').prop("checked", false);
            $(".chk-btn").hide();
  
          });     
  });
  &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I tried adding this to the query:</p>
  
  <pre><code>while($row_filter = mysqli_fetch_assoc($result_filter)){
      $vegan = $row_filter['vegan'];
      $vegetarian = $row_filter['vegetarian'];
      $pescetarian = $row_filter['pescetarian'];
      $tree = $row_filter['tree nut-free'];
      $peanut = $row_filter['peanut-free'];
      $soy = $row_filter['soybean-free'];
      $total = $row_filter['low-total-fat'];
      $dairy = $row_filter['dairy-free'];
      $egg = $row_filter['egg-free'];
      $fish = $row_filter['fish-free'];
      $shellfish = $row_filter['shellfish'];
      $saturated = $row_filter['low-saturated-fat'];
      $cholesterol = $row_filter['low-cholesterol'];
      $sodium = $row_filter['low-sodium'];
      $protein = $row_filter['protein(25g)'];
      $calories = $row_filter['calories(450)'];
  </code></pre>
  
  <p>And on the span I write an if statement saying it vegan ="Y", echo "vegan", so it will be a class, that is the same name as the value of the checkbox but it didn't work, can anyone show me how this is done?
  I'm a bit stuck and really confused.</p>