JSFiddle - React, Tailwind, and code Playground

HTML

<div class="row">
  <div class="col-sm-3 col-md-2">
    <h2><b>Clientes</b></h2>
  </div>

  <div class="col-sm-4 col-md-6" style="border: 1px; border: 2px groove threedface; margin: 1em 2px">
    <label class="" style="margin-right: 20px;">Origem</label>
    <label for="site">Site</label>
    <input type="checkbox" name="site">
    <label class="" for="boca">Boca a Boca</label>
    <input class="" type="checkbox" name="boca" id="boca" class="form-check-input">
    <label class="" for="face">Facebook</label>
    <input class="" type="checkbox" name="face" id="face" class="form-check-input">
    <label class="" for="indica">Indicação</label>
    <input class="" type="checkbox" name="indica" id="indica" class="form-check-input">
  </div>
  <div class="form-group">
    <label>Situação</label>
    <select name="situacaoFiltro" id="situacaoFiltro">                            
                            <option value="1">Ativo</option>
                            <option value="0">Inativo</option>                            
                        </select>
  </div>
</div>

<table id="dataTableClientes" class="display responsive nowrap" width="100%" cellspacing="0">
  <thead>
    <tr>
      <th scope="col"></th>
      <th>Nome</th>
      <th>Email</th>
      <th>Cnpj</th>
      <th>Telefone</th>
      <th>S</th>
      <th>B</th>
      <th>F</th>
      <th>I</th>
      <th>Estado</th>
      <th>Cidade</th>
      <th>Ativo</th>
      <th>Obs</th>
      <th>Ações</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <th>1</th>
      <th>Floriano</th>
      <th>floriano@teste.com.br</th>
      <th>321321.321.321.32.1</th>
      <th>3123123123</th>
      <th>S</th>
      <th>N</th>
      <th>N</th>
      <th>N</th>
      <th>Sao Paulo</th>
      <th>Arealva</th>
      <th>S</th>
      <th>observation</th>
    </tr>
    <tr>
      <th>1</th>
      <th>Floriano</th>
      <th>floriano@teste.com.br</th>
      <th>321321.321.321.32.1</th>
      <th>3123123123</th>
     ...

JavaScript

$(document).ready(function() {
  var table = $('#dataTableClientes').DataTable();

  $('input:checkbox').on('change', function() {
    //build a regex filter string with an or(|) condition
    var site = $('input:checkbox[name="site"]:checked').map(function() {
      return this.value === 'on' ? 'S' : 'N';
    }).get().join('|');

    //filter in column 5, with an regex, no smart filtering, not case sensitive        
    table.column(5).search(site, true, false, false).draw(false);

    var boca = $('input:checkbox[name="boca"]:checked').map(function() {
      return this.value === 'on' ? 'S' : 'N';
    }).get().join('|');

    console.log(boca);

    table.column(6).search(boca, true, false, false).draw(false);

  });

});