One workaround is to wrap the contents of each TD in a DIV. Hide those divs and then slide them down. The only other thing I would suggest is to use fadeIn() instead.

--Karl

____________
Karl Swedberg
www.englishrules.com
www.learningjquery.com




On Mar 28, 2009, at 7:17 AM, Jsbeginner wrote:


Hello,

I'm trying to use the jquery slidedown function with table rows but it does not work as jquery defines them with display:block which places the whole row in the first colomn and makes the whole table layout go wrong ...

Do you have any suggestions how to get around this ?

Here's my code :

$("#tableid tbody").append("<tr style=\"display: none\" id= \"rownum"+TotalRows+"\"><td>"+data.rowone+"</td><td>"+data.rowtwo+" </td><td>"+data.rowthree+"</td></tr>");
$("#rownum"+TotalRows).slideDown();

This code is placed in an ajax request success function and I would like the new row to slidedown and not just appear...

Here is the html code generated by the slideDown function :

<tr style="display: block;" id="rownum1"><td>Data 1</td><td>Data 2 </ td><td>Data 3</td></tr>

It's the display: block that make the layout not work in Firefox etc... If you don't think it's possible to do this then it's not the end of the world, I just thought it would look nicer for not much more code ...

Thankyou.


Reply via email to