数据表选择过滤器

Question

我正在尝试使用<select>为我的数据表创建自定义过滤器。

当某人选择其中一个选项时，如何使数据表根据选择显示项目，而无需刷新页面？

数据表代码：

 $(document).ready(function() {
      $('#datatable').DataTable({
        "pagingType": "full_numbers",
        "lengthMenu": [
          [10, 25, 50, -1],
          [10, 25, 50, "Todas"]
        ],
        responsive: true,
        language: {
          search: "_INPUT_",
          searchPlaceholder: "Filtro", //Ignorem isso
        }


      });

      var table = $('#datatable').DataTable();

    });

我还应该如何做才能不创建多个具有相同值的选项？

代码：

<select class="form-control" placeholder="pais" name="pais">
<option selected >PAÍS</option>
<?php foreach ($resultado as $row) { ?>
<option value="<?=$row['pais']?>"> <?php echo $row['pais']; ?></option>
<?php } ?>
</select>
</div>

结果：

<select class="form-control" placeholder="pais" name="pais">
<option selected >PAÍS</option>
<option value="BRAZIL"> BRAZIL</option>
<option value="BRAZIL"> BRAZIL</option>
<option value="BRAZIL"> BRAZIL</option>
<option value="BRAZIL"> BRAZIL</option>
<option value="BRAZIL"> BRAZIL</option>
</select>

我选择“巴西”，数据表列出了国家/地区为“巴西”的所有项目。

更多代码：

<?php
//error_reporting(0);
require_once("ct.php");
session_start();

$resultado = array(); 
$query = "SELECT * FROM infh";
$result = mysqli_query($connect, $query); 
$resultado = $result->fetch_all(MYSQLI_ASSOC);




<table id="datatable" class="table table-striped table-bordered" cellspacing="0" width="100%">
                  <thead>
                     <tr>
                        <th style="display:none;">ID</th>
                        <th>BIN</th>                         
                        <th>BANDEIRA</th>
                        <th>LEVEL</th>
                        <th>BANCO</th>                                             
                        <th>PAÍS</th>

                     </tr>
                  </thead>
                  <tfoot>
                     <tr>
                        <th style="display:none;">ID</th>
                        <th>BIN</th>
                        <th>BANDEIRA</th>
                        <th>LEVEL</th>
                        <th>BANCO</th>
                        <th>PAÍS</th>

                     </tr>
                  </tfoot>
                  <tbody>
                    <?php foreach ($resultado as $row) { ?>
                     <tr>
                        <td style="display:none;" class="id_<?=$row['id']?>"><?php echo $row['id']; ?></td>
                        <td class="seis_<?=$row['id']?>"><?php echo substr($row['pr'],0,6); ?></td>
                        <td class="bandeira_<?=$row['id']?>"><?php echo $row['bandeira']; ?></td>
                        <td class="level_<?=$row['id']?>"><?php echo $row['level']; ?></td>
                        <td class="banco_<?=$row['id']?>"><?php echo $row['banco']; ?></td>
                        <td class="pais_<?=$row['id']?>"><?php echo $row['pais']; ?></td>

                     </tr>
                     <?php } ?>
                  </tbody>
               </table>