Follow up question, if I instead wanted to use multiple table cells
instead of one big colspan, is there a way to do this same sort of
thing without a div?


On Feb 12, 11:35 pm, mkmanning <michaell...@gmail.com> wrote:
> That should read "..first-child of its parent,.." in the first
> sentence
>
> On Feb 12, 11:33 pm, mkmanning <michaell...@gmail.com> wrote:
>
> > Actually, Mark's use of 'first-child' is correct. ':first-child' is
> > used to indicate the the element is the first-child its parent, not
> > the parent element's first-child. The tr has a class of .ajax, and
> > since it's prepended to the tbody, it is the first-child of the tbody,
> > so the correct selector to get it would in fact be '.ajax:first-
> > child'; you could also use '#recent_activity tbody tr:first-child'
> > which means the same thing.
>
> > The problem you're having with the display once you call the slideDown
> > () and fadeIn() functions is that they apply a style of
> > 'display:block' to the table row, which results in the td not spanning
> > other table cells like you'd expect. You need to put a div inside the
> > td and use the slideDown() and fadeIn() functions on that.
>
> > If you want a very 'jQuery' chaining approach, try this:
>
> > $('<div>').css('display','none').text('Testing this func').appendTo($
> > ('<td>').attr('colspan','7').appendTo($('<tr>').prependTo
> > ('#recent_activity tbody'))).slideDown('slow').fadeIn('slow');
>
> > On Feb 12, 6:51 pm, James <james.gp....@gmail.com> wrote:
>
> > > That's probably because you're using the "first-child" of the <tr>,
> > > which is just the first <td>.
> > > Maybe you intended to do:
> > > $(".ajax").slideDown('slow')
> > > ?
>
> > > I'm not sure of its effects for a tr though compared to a div.
>
> > > On Feb 12, 4:43 pm, Mark Steudel <msteu...@gmail.com> wrote:
>
> > > > I have a table that is setup with a tbody tag.
>
> > > > If I run the following:
>
> > > > $("#recent_activity tbody").prepend( '<tr class="ajax"><td
> > > > colspan="7">Testing this func</td></tr>' );
>
> > > > I get a new row spanning 7 columns
>
> > > > If I prepend this:
> > > > $("#recent_activity tbody").prepend( '<tr style="display:none"
> > > > class="ajax"><td colspan="7">Testing this func</td></tr>' );
>
> > > > Then try to show it, with something like:
> > > > $(".ajax:first-child").slideDown('slow').fadeIn('slow');
>
> > > > I only get the first cell showing up. Why does this happen?

Reply via email to