title: Filter query results with checkboxes [PHP] [MYSQL]
body: <p>In my site there is a page where is shown the content of my database (the list of all the locals). I would like to let the user filter the research, so I would like that my query that show the resoults can be modified by checkboxes. If a user select Vegan in the checkbox, the page must show only vegan locals. I don't have a form for the checkboxes so I don't know hot to handle the input.
  I have two scripts: <strong>locals_page.php</strong> that is the main page with the filter boxes and <strong>table_generator.php</strong> that is a php script that do the query and retrieve the data, and show them into locals_page.php</p>
  
  <p>I searched a lot to resolve this but I don't know how to start because I don't have a simple table for the resoults or a common form.</p>
  
  <p>Maybe it's a generic question, but an help will be appreciated.</p>
  
  <p><strong>locals_page</strong></p>
  
  <pre><code>&lt;body&gt;
      &lt;div class="container"&gt;
          &lt;div class="row"&gt;
              &lt;!--FILTERS PART--&gt;
              &lt;div class="col-sm-3 col-md-3"&gt;
                  &lt;div class="panel-group" id="accordion"&gt;
                      &lt;div class="panel panel-default"&gt;
                          &lt;div class="panel-heading"&gt;
                              &lt;h4 class="panel-title"&gt;
                                  &lt;a data-toggle="collapse" data-parent="#accordion" href="#collapseOne"&gt;&lt;span class="glyphicon glyphicon-folder-close"&gt;
                                  &lt;/span&gt;Kitchen type&lt;/a&gt;
                              &lt;/h4&gt;
                          &lt;/div&gt;
                          &lt;div id="collapseOne" class="panel-collapse collapse in"&gt;
                              &lt;div class="panel-body"&gt;
                                  &lt;table class="table"&gt;
                                      &lt;tr&gt;
                                          &lt;td&gt;
                                              &lt;input type="checkbox" name="Kebab" value="Kebab"&gt; Kebab
                                          &lt;/td&gt;
                                      &lt;/tr&gt;
                                      &lt;tr&gt;
                                          &lt;td&gt;
                                              &lt;input type="checkbox" name="Asiatic" value="Asiatic"&gt; Asiatic
                                          &lt;/td&gt;
                                      &lt;/tr&gt;
                                      &lt;tr&gt;
                                          &lt;td&gt;
                                              &lt;input type="checkbox" name="Vegan" value="Vegan"&gt; Vegan
                                          &lt;/td&gt;
                                      &lt;/tr&gt;
                                  &lt;/table&gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="panel panel-default"&gt;
                          &lt;div class="panel-heading"&gt;
                              &lt;h4 class="panel-title"&gt;
                                  &lt;a data-toggle="collapse" data-parent="#accordion" href="#collapseTwo"&gt;&lt;span class="glyphicon glyphicon-th"&gt;
                                  &lt;/span&gt;Local Type&lt;/a&gt;
                              &lt;/h4&gt;
                          &lt;/div&gt;
                          &lt;div id="collapseTwo" class="panel-collapse collapse"&gt;
                              &lt;div class="panel-body"&gt;
                                  &lt;table class="table"&gt;
                                      &lt;tr&gt;
                                          &lt;td&gt;
                                              &lt;input type="checkbox" name="Restaurant" value="Restaurant"&gt; Restaurant
                                          &lt;/td&gt;
                                      &lt;/tr&gt;
                                      &lt;tr&gt;
                                          &lt;td&gt;
                                              &lt;input type="checkbox" name="Pub" value="Pub"&gt; Pub
                                          &lt;/td&gt;
                                      &lt;/tr&gt;
                                  &lt;/table&gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
              &lt;!--END FILTERS PART--&gt;
              &lt;div class="col-sm-9 col-md-9"&gt;
                  &lt;!--SCRIPT THAT GENERATE MY PAGE--&gt;
                  &lt;?php require_once('php\table_generator.php'); ?&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p><strong>table_generator</strong></p>
  
  <pre><code>&lt;?php
      echo '&lt;section class="col-xs-12 col-sm-6 col-md-12"&gt;';
      $sql = "SELECT nome_L, tipocucina_TC, wifi_L, tipolocale_TL, descrizione_L, indirizzo_L, fasciaprezzo_L, convenzione_L FROM locale l 
                          JOIN tipocucina c On l.TipoCucina_L = c.IDtipocucina_TC
                          JOIN tipolocale t On l.TipoLocale_L = t.IDTipolocale_TL";
      $result = mysqli_query($conn, $sql) or die(mysqli_error($conn));
      while ($row = mysqli_fetch_array($result)) {
          $nome_Local        = $row['nome_L'];
          $descrizione_Local = $row['descrizione_L'];
          $indirizzo_Local   = $row['indirizzo_L'];
          $tipocucina_Local  = $row['tipocucina_TC'];
          $tipolocale_Local  = $row['tipolocale_TL'];
          $wifi_Local        = $row['wifi_L'];
          $prezzo_Local      = $row['fasciaprezzo_L'];
          //Inizio article
          echo '&lt;article class="search-result row"&gt;
              &lt;div class="col-xs-12 col-sm-12 col-md-3"&gt;
                  &lt;a class="thumbnail"&gt;&lt;img src="https://upload.wikimedia.org/wikipedia/commons/thumb/e/e6/Piadina.jpg/1200px-Piadina.jpg" alt="Lorem ipsum" /&gt;&lt;/a&gt;
              &lt;/div&gt;
              &lt;div class="col-xs-12 col-sm-12 col-md-2" style="width: 18%;"&gt;
                  &lt;ul class="meta-search"&gt;
                      &lt;li&gt;&lt;i class="fa fa-cutlery fa-lg"&gt;&lt;/i&gt; &lt;span&gt;' . $tipocucina_Local . '&lt;/span&gt;&lt;/li&gt;
                      &lt;li&gt;&lt;i class="fa fa-coffee fa-lg"&gt;&lt;/i&gt; &lt;span&gt;' . $tipolocale_Local . '&lt;/span&gt;&lt;/li&gt;
                      &lt;li&gt;&lt;i class="fa fa-coffee fa-lg"&gt;&lt;/i&gt; &lt;span&gt;' . $wifi_Local . '&lt;/span&gt;&lt;/li&gt;
                      &lt;li&gt;&lt;i class="fa fa-coffee fa-lg"&gt;&lt;/i&gt; &lt;span&gt;' . $prezzo_Local . '&lt;/span&gt;&lt;/li&gt;
                  &lt;/ul&gt;
              &lt;/div&gt;
              &lt;div class="col-xs-12 col-sm-12 col-md-7 excerpet" style="width: 55%;"&gt;';
  
          echo "&lt;h3&gt;&lt;a&gt;" . $nome_Local . "&lt;/a&gt;&lt;/h3&gt;";
          echo '&lt;i class="fa fa-compass"&gt; &lt;/i&gt;' . $indirizzo_Local . '&lt;/i&gt;';
          echo "&lt;br&gt;";
          echo '&lt;p class="local-description"&gt;' . $descrizione_Local . '&lt;/p&gt;';
          echo '
                  &lt;/div&gt;
                  &lt;span class="clearfix borda"&gt;&lt;/span&gt;
              &lt;/article&gt;'; //Fine article
      }
      $conn-&gt;close();
      echo "&lt;/section&gt;";
  ?&gt;
  </code></pre>
  
  <p>I don't know if javascript or ajax or jquery is needed. I don't ever know how to start. I hope my problem is understandable and that the code I put is helpful. Thank you so much in advice.</p>