1

How do I search for an exact match in the search bar of JQuery Datable I tried using fnFilter but it's still not returning an exact match.

  $(document).ready(function() {
    var oTable = $('#datacal_table').DataTable({"order": [[4, "asc"]]});
    oTable.fnFilter("^"+$(this).val()+"$", 4, true);
  });

For example I only watch to search 'active' but what happens is the 'inactive' words also returns in the result. What should I do I need to be able to search only the the exact string.

Post image

EDIT

I tried one of inuka's links How to search for an exact string in a jQuery DataTable?

and it seems like my text class is interfering with the search, how do I get around this? I want to keep using my class text so that it's colored.

<td id="status">
      <span class = "label {{ getStatusColor($data->status) }}"
       id    = "status_{{ $data->id }}">
       {{ getStatusText($data->status) }}
      </span>
</td>

when I only retain {{getStatusText}} the search works but when I try to class it, it doesn't.

<script type="text/javascript">
  $(document).ready(function() {
    var table = $('#datacal_table').DataTable({
      "order": [[4, "asc"]]
    });
    $('.dataTables_filter input', table.table().container())
    .off('.DT')
    .on('keyup.DT cut.DT paste.DT input.DT search.DT', function(e) {
      var term = $.trim(this.value);
      if (term !== ""){
        var termRegExp = new RegExp('^' + $.fn.dataTable.util.escapeRegex(term) + '$', 'i');

        $.fn.dataTable.ext.search.push(
          function (settings, data, dataIndex){
            var isFound = false;
            $.each(data, function (index, value) {
              if (termRegExp.test(value)){ isFound = true; }
              return !isFound;
            });
            return isFound;
          }
        );
      }

      table.draw();

      if (term !== "") {
        $.fn.dataTable.ext.search.pop();
      }
    });
  });
  </script>
Community
  • 1
  • 1
  • Possible duplicate of [jQuery DataTables - Filter column by exact match](http://stackoverflow.com/questions/8609577/jquery-datatables-filter-column-by-exact-match) – CodeMonkey Apr 27 '17 at 03:41
  • Also you can look under [search exact match and highlight jquery datatable regex](http://stackoverflow.com/questions/29783136/search-exact-match-and-highlight-jquery-datatable-regex) and [How to search for an exact string in a jQuery DataTable?](http://stackoverflow.com/questions/33122994/how-to-search-for-an-exact-string-in-a-jquery-datatable) – CodeMonkey Apr 27 '17 at 03:44
  • 1
    I am sorry I didn't put any more details I tried one of ur links I got it partially working but see my updated post another problem has presented itself. –  Apr 27 '17 at 03:56
  • Should I make another topic about this? –  Apr 27 '17 at 04:01
  • No keep it as it is and hopefully someone can help you out. I will look into this too. :) – CodeMonkey Apr 27 '17 at 04:01
  • Try [this](http://stackoverflow.com/questions/29319782/using-datatables-how-to-specify-an-element-inside-a-td-to-be-searched) question for your answer and [this](http://stackoverflow.com/questions/30210730/databable-search-by-only-text-inside-td-tag)? – CodeMonkey Apr 27 '17 at 04:08
  • 1
    First link worked. the `` method. –  Apr 27 '17 at 04:40
  • Hope everything is sorted for you. Would you like me to post an answer to close this question? – CodeMonkey Apr 27 '17 at 05:33
  • Ok sure please do. –  Apr 27 '17 at 06:02

2 Answers2

0

try this code

var oTable = $('.datatable').DataTable(); 
$('.dataTables_filter input').keyup( function () {
      oTable.fnFilter("^"+$(this).val(),0,true,false);
});

working link http://codepen.io/subbu1191/pen/GmrvNd

1.{string}: String to filter the table on
2.{int|null}: Column to limit filtering to
3.{bool} [default=false]: Treat as regular expression or not
4.{bool} [default=true]: Perform smart filtering or not
5.{bool} [default=true]: Show the input global filter in it's input box(es)
6.{bool} [default=true]: Do case-insensitive matching (true) or not (false)

you have to make the smart filtering false in order to get the regex working

subramanian
  • 1,125
  • 1
  • 12
  • 12
0

The following answer from this post will give you an answer for searching term inside your HTML table structure.

$('#datacal_table').DataTable({
   "columnDefs": [{
      "targets": [4],
      "render": function ( data, type, full, meta ) {
         if(type === 'filter'){
            return $('#datacal_table').DataTable().cell(meta.row, meta.col).nodes().to$().find('span').text();
         } else {
            return data;
         }
      }
   }]
});

According to Datatables documentation this columnDefs.targets will give you the option to match only specified column name values. "targets": [4] will only focus on values under your Status column.

Community
  • 1
  • 1
CodeMonkey
  • 2,828
  • 1
  • 23
  • 32