Datentabellen wird mit meiner Bootstrap-Klasse auf select-Filtersäule Filterung

Question

verwirrt Wenn ich Datentabellen Spalte Filterung mit ihren eingebauten Auswahlfilter verwenden Sie es mit meinem <span class="label label-success"> Active </span> und kehrt verwirrt wird diese:

Ich möchte sie nicht haben die "Gelöscht‚> Gelöscht‘usw. und Gelöschte nur Return, aktiv, inaktiv, so dass die Filterung funktioniert.

Mein Javascript

$(document).ready(function() { 
     $('#questionnaireTable').DataTable({ 
      select: { 
       style: 'multi' 
      }, 
      initComplete: function() { 
       this.api().columns().every(function() { 
        var column = this; 
        var select = $('<select><option value=""></option></select>') 
         .appendTo($(column.footer()).empty()) 
         .on('change', function() { 
          var val = $.fn.dataTable.util.escapeRegex(
           $(this).val() 
          ); 

          column 
           .search(val ? '^'+val+'$' : '', true, false) 
           .draw(); 
         }); 

        column.data().unique().sort().each(function (d, j) { 
         select.append('<option value="'+d+'">'+d+'</option>') 
        }); 
       }); 
      } 
     }); 
}); 

und Blade-Engine (Laravel) Zurückführen der Html:

    <td> 
        @if($questionnaire->deleted_at) 
         <span class="label label-danger"> Deleted </span> 
        @elseif($questionnaire->status == \App\Models\Questionnaire::STATUS_ACTIVE) 
         <span class="label label-success"> Active </span> 
        @elseif($questionnaire->status == \App\Models\Questionnaire::STATUS_INACTIVE) 
         <span class="label label-warning"> Inactive </span> 
        @else 
         <span class="label label-danger"> Invalid Status </span> 
        @endif 
       </td> 

Alle Zeiger wird geschätzt!

Answer 1

column.data().unique().sort().each(function (d, j) { 
    select.append('<option value="'+d+'">'+d+'</option>') 
}); 

Ich denke, weil in dem obigen Code, wenn in der Schleife, d = '<span class="label label-danger"> Deleted/Active... </span>'.

Sie können nur den Text in der Spanne, bevor Sie mithilfe $(d).text()