Select Table row within a table that has a td of foo

[scottlafoy]

I have a master page with a table that contains main content and side bar content. The main content is where the different pages of the site are shown, and the side bar content has stuff like email and friends lists.

The mail list is on a model popup and when opened will ajax populate the table with rows containing image, subject, sender, time, all in different td's. When I click a row, the message pops up. From the message I can choose to reply or delete. When I delete I want to fade out the row that was deleted. I can wait the 10 seconds until the list does a refresh but I would rather have this cool visual effect.

My problem is I am having difficulty selecting the tr I want. My table has an id of MainMailTable and when I check it does not have the ct100: added in front.

Here is what I am trying:

$('#MainMailTable:tr:has(td:contains(' + subject + '))').fadeOut(1000);

I am trying to find the row that contains the subject of the message I want to delete. I guess that isnt really unique, and maybe I should add a hidden td with an id to the row (can Jquery get a hidden field?). But I would like to be able to get this first step to work.

When I try:

$('tr:has(td:contains(' + subject + '))').fadeOut(1000);

the whole page disappears, so I think I may be close.

Thank you in advance for any assistance.

[felgall]

Originally Posted by scottlafoy

I have a master page with a table that contains main content and side bar content.

So the first thing to do to bring the HTML into the 21st Century is to get rid of the unsemantic table. The existance of the table is almost certainly the cause of your problem since there are many things that don't work properly inside tables since they don't need to when you use tables correctly.

JavaScript (including jQuery) works entirely differently within tables to how it does outside tables.

[Old Pedant]

??? So what is it the user clicks on to delete a *particular* row???

If it is the <td> with the subject, why not just detect the onclick of the subject and then fade out the containing row?

I mean, you are looking for contains(' + subject + ') and that implies to me that somehow the user clicked on or otherwise located that <td> already, so why do we have to look for it again??

[scottlafoy]

Originally Posted by Old Pedant

??? So what is it the user clicks on to delete a *particular* row???

If it is the <td> with the subject, why not just detect the onclick of the subject and then fade out the containing row?

I mean, you are looking for contains(' + subject + ') and that implies to me that somehow the user clicked on or otherwise located that <td> already, so why do we have to look for it again??

The user is deleting messages from a box that pops up in front of the message table so I am not deleting the table row by clicking on it. I have to find the row that brought up the message to begin with.

I have found a solution to the jquery problem, I just now have to change it to use the ID's

For anyone looking for a way to do this:

$('table table tr:has(td:contains(' + subject + '))').fadeOut(1000);