Home/ Questions/Q 8688447
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-12T23:22:00+00:00

I’d like to check for empty TDs (classes a-h only) and if all are

  • 0

I’d like to check for empty TDs (classes a-h only) and if all are empty, then I’d like to hide the parent TR. The issues I’m running into are, my empty TDs contain ” ” I’m not sure how to test for those?

http://jsfiddle.net/FeQ7h/1/

<table>
  <tr>
    <td class="requirementRight">Requirement</td>
    <td class="a">&nbsp;</td>
    <td class="b">&nbsp;</td>
    <td class="c">&nbsp;</td>
    <td class="d">&nbsp;</td>
    <td class="e">&nbsp;</td>
    <td class="f">NOT EMPTY</td>
    <td class="g">&nbsp;</td>
    <td class="h">&nbsp;</td>
  </tr>
  <tr>
    <td class="requirementRight">Requirement</td>
    <td class="a">&nbsp;</td>
    <td class="b">&nbsp;</td>
    <td class="c">&nbsp;</td>
    <td class="d">&nbsp;</td>
    <td class="e">&nbsp;</td>
    <td class="f">&nbsp;</td>
    <td class="g">&nbsp;</td>
    <td class="h">&nbsp;</td>
  </tr>

​

if ( $('td.a:empty, td.b:empty, td.c:empty, td.d:empty, td.e:empty, td.f:empty, td.g:empty, td.h:empty') ) {
   // hide the parent tr
} ​
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    “If Empty” is not clear, since in your example, they are filled with “nbsp”. This is the reason why I made a function called isEmpty() so you can define your custom rules in there. Since you didn’t want requirementRight, I put td:not(.requirementRight). This is not the correct way to do it.

    The correct way to do it, would be to put a second class on a-h, such as 

    <tr>
    <td class="requirementRight">Requirement</td>
    <td class="checkempty a">&nbsp;</td>
    <td class="checkempty b">&nbsp;</td>
    <td class="checkempty c">&nbsp;</td>
    <td class="checkempty d">&nbsp;</td>
    <td class="checkempty e">&nbsp;</td>
    <td class="checkempty f">NOT EMPTY</td>
    <td class="checkempty g">&nbsp;</td>
    <td class="checkempty h">&nbsp;</td>
  </tr>

    So we can call tr.find(tr.checkempty)..

    Anyway, here’s the code! 

    $("tr").each(function() {
  var trIsEmpty = true;
  var tr = $(this);

    tr.find("td:not(.requirementRight)").each(function() {
      td = $(this);

        if (isEmpty(td) === false)  {
         trIsEmpty = false;   
        }
    });

    if (trIsEmpty == true) {
         tr.hide();                       
    }
});

    function isEmpty(td) {
        if (td.text == '' || td.text() == ' ' || td.html() == '&nbsp;' || td.is(":not(:visible)")) {
            return true;
        }            

        return false;
    }
​

    Working Example: http://jsfiddle.net/FeQ7h/7/

    • 0