Hiding a table row according to a value

Question

Hi, I do not find the right expression to select table rows that must be hidden according to the value ofe the cell on which the user has clicked. I have several rows similar to this:

<tr id='row2'>
<td class='col1'>val 1</td>
<td class='col2'>Val 2</td>
<td class='col3'>val 3</td>
<td class='col4'>Val 4</td>
<td class='col5'>Val 5</td>
<td class='col6'>Val 6</td>
<td class='col7'>Val 7</td></tr>

and different rows could have the same value on the same column. When che user clicks on a cell I wish to hide() all the cells that have a value different from the selected one.

I have binded my click event and in the routine I have already got the class id of the column (let say: 'col 4') clicked and the value of the cell (let say: 'val 4'). I would expect that something like:

$('tr').not(...some expression...).contains('val 4').hide()

would save the day bu I have trouble to determine the proper expression.

have some hints?

Thanks

Answer 1

Try this:

$("td").click(function() {
    column = 1 + $(this).prevAll().size(); // gets column number
    text = $(this).html();
    $("td.col" + column).not(":contains('"+text+"')").parent().hide();
});

Answer 2

Your question is a little confusing. I'm tackling it with the thought that the click event is bound to the individual cells [td].

// "this" is the cell(td) because it is within the bound event.

$(this).is(':contains("Val 4")') ? $(this).parent().hide() : return;