views:

61

answers:

1

Hi All, I have a table, now on load i am hiding few last rows.Now on click of a span it will expand (last few rows)and collapse.I am using Slidetoggle(), and its working fine in IE, but the problem is its breaking in FF, first few rows are breaking in FF.how to fix this?any suggestion? EDIT:

$("tr").slice(index).slideToggle('slow')//this works fine in IE but in FF, the first few rows became right-aligned, thus breaking the table layout, this can be fixed using dispaly:""..something like 
$("tr").slice(index).css("dispaly","")..

but I am using slidetoggle(). so facing the issue EDIT: HTML:

enter code here <div>
<table>
    <tr>
        <td>
            td1
        </td>
        <td>
            td11
        </td>
        <td>
           td111
        </td>
    </tr>
    <tr>
        <td>
            td2
        </td>
        <td>
            td22
        </td>
        <td>
             td222
        </td>
    </tr>
    <tr>
        <td>
            td3
        </td>
        <td>
            td33
        </td>
        <td>
            td333
        </td>
    </tr>
       <tr>
        <td>
            td3
        </td>
        <td>
            td33
        </td>
        <td>
            td333
        </td>
    </tr>
       <tr>
        <td>
            td3
        </td>
        <td>
            td33
        </td>
        <td>
            td333
        </td>
    </tr>
       <tr>
        <td>
            td3
        </td>
        <td>
            td33
        </td>
        <td>
            td333
        </td>
    </tr>
       <tr>
        <td>
            td3
        </td>
        <td>
            td33
        </td>
        <td>
            td333
        </td>
    </tr>
       <tr>
        <td>
            td3
        </td>
        <td>
            td33
        </td>
        <td>
            td333
        </td>
    </tr>   <tr>
        <td>
            td3
        </td>
        <td>
            td33
        </td>
        <td>
            td333
        </td>
    </tr>
</table>

+2  A: 

Providing the table HTML in addition to the javascript in the Question would further clarify, but the problem may be related to a Firefox colspan quirk.

So one work around is to dynamically wrap each innerHTML of each TD with a DIV as shown here:
http://stackoverflow.com/questions/1269220/jquery-slidetoggle-doesnt-work-with-colspan-in-firefox/1269236#1269236

You could also experiment with re-setting the colspan:
http://stackoverflow.com/questions/882372/td-colspan-does-not-work-while-using-jquery-show-hide/882419#882419

micahwittman
Now that I refresh the page - boom: the table HTML. :)
micahwittman
Humm, I think thats the way.Thanks for the link :-)
Wondering
Glad to help :)
micahwittman