[jquery] Jquery Hide table rows

I am hiding a bunch of textboxes and it works fine, the problem is, the textboxes are in a table, so I also need to hide the corresponding labels. the structure is something like this

<tr>
<td>
Label
</td>
<td>
InputFile
</td>
</tr>

in fact its just easier if I hide the rows that have a fileinput , can someone help please

html

<tr><td><a href="" onclick=hideRow(event)></a></td></tr>

jquery

function hideRow(event){
  $(event.target || event.srcElement).parents('tr').hide();
}

$('inputFile').parent().parent().children('td > label').hide();

can help you navigate two levels up ( to TD, to TR ) moving two levels back down ( all TD's in that TR and their LABEL tags ), applying the hide() function there.

if you want to stay at the TR level and hide them:

$('inputFile').parent().parent().hide();

… is sufficient.

you can navigate very easily through the elements using the jquery selectors.

parent is documented here: http://api.jquery.com/parent/

hide is documented here: http://api.jquery.com/hide/

You just need to traverse up the DOM tree to the nearest <tr> like so...

$("#ID_OF_ELEMENT").parents("tr").hide();

jQuery API Reference

Using parents('tr').hide() works. However if there is an embedded table, all parent tr rows will be hidden. In my case, the entire form is hidden since there are many embedded tables.

This should do the trick.

$(textInput).closest("tr").hide();

I think your best bet if you want both text field and label to hide simultaneously is assign each with a class and hide them like this:

jQuery(".labelClass, .inputClass").hide();

If the label is in a table row you can do this to hide the row:

('.InputFile').parent().Hide()

You can refine your selector as you need and then get the table row that contains that element.

JQuery Selectors help: http://api.jquery.com/category/selectors/

EDIT This is the correct way to do it.

    ('.InputFile').parents('tr').hide()