jquery exact match in html table

Question

I'm about to edit an addon and I have a problem with the jquery list, that filters and hides some elements of a table/html.

$(document).ready(function(){
    $('tr').find('td:contains("1,0")').closest('tr').hide();
    $('tr').find('td:contains("1.0")').closest('tr').hide();
});

Thats the way I'm using it right now. The function is that I dont want to see the rows with "1,0" and "1.0" anywhere in the row. There can be anything around the "1,0" or "1.0". Like "cars 1,0" or "paper 1.0".

The problem I have is, that this code also hides rows like "paper 11.00" and "cars 1,020". Anyrow that contains "1.0" "1,0" in any form.

Can anyone please help me to adjust the "filter", to avoid hiding "11.00" or "1,020"?

how about this regex: `\b1[\.,]0\b` \b matches word boundries — Nullman, Mar 02 '17 at 12:37
You can use `.filter()` to filtering selected elements. Check http://stackoverflow.com/a/40906817/5104748 — Mohammad, Mar 02 '17 at 12:38

score 0 · Answer 1 · answered Mar 02 '17 at 12:40

Use .filter() and td.text().match with regex \b1[.,]0\b to match 1.0 and 1,0

$(document).ready(function() {
  $('td')
    .filter(function() {
      return $(this).text().match(/\b1[.,]0\b/)
    })
    .closest('tr')
    .hide();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <td>1.0</td>
  </tr>
  <tr>
    <td>1,0</td>
  </tr>
  <tr>
    <td>1.01</td>
  </tr>
  <tr>
    <td>11.0</td>
  </tr>
  <tr>
    <td>var 1.0 bar</td>
  </tr>
  <tr>
    <td>var 1,0 bar</td>
  </tr>
  <tr>
    <td>1 . 0</td>
  </tr>
</table>

thank you as well @justinas works like it should. at the beginning it was performing very slow, but now its running like crazy. do you have any idea why it was performing so bad in the beginning? — LionKing, Mar 02 '17 at 14:51

RomanPerekhrest · Answer 2 · 2017-03-02T18:33:27.197

0

The solution using JQuery $.each() and RegExp.prototype.test() functions:

$(document).ready(function(){
    $('tr td').each(function(i, el){
        if (/\b(1\.0|1,0)\b/g.test($(el).text())) {
            $(el).closest('tr').hide();
        }   
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table border="1">
<tr><td>11.0</td></tr>
<tr><td>cars 1,020</td></tr>
<tr><td>1.0</td></tr>
<tr><td>cars 1,0</td></tr>
</table>

edited Mar 02 '17 at 18:33

answered Mar 02 '17 at 12:41

RomanPerekhrest

88,541
4
65
105

thank you RomanPerekhrest for the solution. your code works like a charm and very fast. Just one problem: it only "hides" the cell in which, it finds the 1,0 etc. I need it to hide the whole row, like it works with td:contains. Do I miss something? – LionKing Mar 02 '17 at 14:30
@LionKing, added getting of parent `tr`(row). Now it works fine – RomanPerekhrest Mar 02 '17 at 18:34

jquery exact match in html table

2 Answers2