fixedColumn not freezing first column, fixedColumns:2 hiding table #27

gregpinero · 2011-12-20T15:50:02Z

Nothing seems to happen when I use this:
$('#result_list').fixedHeaderTable({ footer: false, cloneHeadToFoot: false, fixedColumn: true});

And when I use this, the table dissapears :-(
$('#result_list').fixedHeaderTable({ footer: false, cloneHeadToFoot: false, fixedColumns: 2});

I can send you my HTML. I'll paste the pertinent parts below:

Head section:

<head>
<title>Select Virus Prep. to change | Virus Tracker Site Admin</title>
<link rel="stylesheet" type="text/css" href="/media/admin/css/base.css" />


  <link rel="stylesheet" type="text/css" href="/media/admin/css/changelists.css" />

    <link rel="stylesheet" type="text/css" href="/media/admin/css/forms.css" />



    <script type="text/javascript" src="/admin/jsi18n/"></script>

  <link href="/media/fixed_header_table/css/defaultTheme.css" type="text/css" media="all" rel="stylesheet" />



<link rel="stylesheet" type="text/css" href="/media/janelia_admin.css" />
<!--[if lte IE 7]><link rel="stylesheet" type="text/css" href="/media/admin/css/ie.css" /><![endif]-->

<script type="text/javascript">window.__admin_media_prefix__ = "/media/admin/";</script>


<script type="text/javascript" src="/media/admin/js/core.js"></script>
<script type="text/javascript" src="/media/admin/js/admin/RelatedObjectLookups.js"></script>
<script type="text/javascript" src="/media/admin/js/jquery.min.js"></script>
<script type="text/javascript" src="/media/admin/js/jquery.init.js"></script>
<script type="text/javascript" src="/media/admin/js/actions.min.js"></script>

<script type="text/javascript" src="/media/jquery-1.5.2.min.js"></script>
<script type="text/javascript" src="/media/list_filter_collapse.js"></script>
<script type="text/javascript" src="/media/decimal_to_sci_not.js"></script>
<script type="text/javascript" src="/media/fixed_header_table/lib/jquery.mousewheel.js"></script>
<script type="text/javascript" src="/media/fixed_header_table/jquery.fixedheadertable.min.js"></script>
<script type="text/javascript" src="/media/freeze_cols.js"></script>
<script type="text/javascript" src="/media/admin/js/calendar.js"></script>
<script type="text/javascript" src="/media/admin/js/admin/DateTimeShortcuts.js"></script>

<script type="text/javascript">
(function($) {
    $(document).ready(function($) {
        $("tr input.action-select").actions();
    });
})(django.jQuery);
</script>


<meta name="robots" content="NONE,NOARCHIVE" />
</head>

Table is formatted like this:

<table cellspacing="0" id="result_list">
<thead>
<tr>
<th>...</th>
...
</tr>
</thead>
<tbody>
<tr>...</tr>
...
</tbody>
</table>

freeze_cols.js contains:

$(document).ready( function () {
    $('#result_list').fixedHeaderTable({ footer: false, cloneHeadToFoot: false, 
        fixedColumn: true});
});

The text was updated successfully, but these errors were encountered:

markmalek · 2012-01-12T20:46:02Z

What version of the plugin are you using? Did you download the latest version through github or from my demo site?

(I'm running an older version on my demo site which I need to update which doesn't support multiple fixed columns)

If you are using the latest hosted through github then there may be something else going on. Perhaps a conflict with another script. Can you send me more detailed table markup?

xeromorph · 2012-01-13T01:13:16Z

same goes for me, using last minified version of master branch.
tested against most simple markup

<!DOCTYPE html>
<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <link href="/defaultTheme.css" rel="stylesheet" type="text/css">
    <script src="/jquery-1.5.1.min.js" type="text/javascript"></script>
    <script src="/jquery-ui-1.8.14.custom.min.js" type="text/javascript"></script>
    <script src="/jquery-ui-1.8.11.min.js" type="text/javascript"></script>
    <script src="/jquery.fixedheadertable.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $("#fixedTable").fixedHeaderTable({
               fixedColumns: 4
            });
        });
    </script>
</head>
<body>
<div>
<table id="fixedTable">
        <thead>
            <tr>
                <th></th>
                ...over 20 columns
                <th></th>
            </tr>
        </thead>
        <tbody>
                <tr>
                    <td></td>
                    ...
                    <td></td>
                </tr>
        </tbody>
        <tfoot>
            <tr>
                <th></th>
                ...
                <th></th>
            </tr>
        </tfoot>
    </table>
</div>
</body>
</html>

makes given table invisible generating following code

<div class="fht-table-wrapper fht-default" style="width: 100%; height: 100%; ">
<div class="fht-fixed-column" style="height: 0px; width: 331px; ">
<div class="fht-thead">
<table class="fht-table">
<thead>
<tr>
<th style="height: 70px; width: 99px; "><div class="fht-cell" style="width: 99px; "></div></th>
<th style="height: 70px; width: 97px; "><div class="fht-cell" style="width: 97px; "></div></th>
<th style="height: 70px; width: 38px; "><div class="fht-cell" style="width: 38px; "></div></th>
<th style="height: 70px; width: 97px; "><div class="fht-cell" style="width: 97px; "></div></th>
</tr>
</thead>
</table></div>
<div class="fht-tbody" style="margin-top: -1px; height: 167px; ">
<table class="fht-table">
<tbody>
<tr>
<td style="height: 161px; width: 99px; "></td>
<td style="height: 161px; width: 97px; "></td>
<td style="height: 161px; width: 38px; "></td>
<td style="height: 161px; width: 97px; "></td>
</tr>
</tbody>
</table></div>
</div>
<div class="fht-fixed-body" style="width: 1920px; ">
<div class="fht-thead">
<table class="fht-table">
<thead>
            <tr>
                <th style="height: 70px; width: 99px; "><div class="fht-cell" style="width: 99px; "></div></th>
                <th style="height: 70px; width: 97px; "><div class="fht-cell" style="width: 97px; "></div></th>
                <th style="height: 70px; width: 38px; "><div class="fht-cell" style="width: 38px; "></div></th>
                <th style="height: 70px; width: 97px; "><div class="fht-cell" style="width: 97px; "></div></th>
                <th><div class="fht-cell" style="width: 82px; "></div></th>
                <th><div class="fht-cell" style="width: 101px; "></div></th>
                <th><div class="fht-cell" style="width: 93px; "></div></th>
                <th><div class="fht-cell" style="width: 86px; "></div></th>
                <th><div class="fht-cell" style="width: 88px; "></div></th>
                <th><div class="fht-cell" style="width: 72px; "></div></th>
                <th><div class="fht-cell" style="width: 84px; "></div></th>
                <th><div class="fht-cell" style="width: 84px; "></div></th>
                <th><div class="fht-cell" style="width: 105px; "></div></th>
                <th><div class="fht-cell" style="width: 46px; "></div></th>
                <th><div class="fht-cell" style="width: 61px; "></div></th>
                <th><div class="fht-cell" style="width: 81px; "></div></th>
                <th><div class="fht-cell" style="width: 61px; "></div></th>
                <th><div class="fht-cell" style="width: 61px; "></div></th>
                <th><div class="fht-cell" style="width: 94px; "></div></th>
                <th><div class="fht-cell" style="width: 92px; "></div></th>
                <th><div class="fht-cell" style="width: 73px; "></div></th>
                <th><div class="fht-cell" style="width: 69px; "></div></th>
                <th><div class="fht-cell" style="width: 103px; "></div></th>
                <th style="padding-right: 17px; "><div class="fht-cell" style="width: 133px; "></div></th>
            </tr>
        </thead></table></div><div class="fht-tbody"><table id="fixedTable" style="width: 1903px; margin-top: -70px; " class="fht-table fht-table-init">
        <thead>
            <tr>
                <th><div class="fht-cell" style="width: 99px; "></div></th>
                <th><div class="fht-cell" style="width: 97px; "></div></th>
                <th><div class="fht-cell" style="width: 38px; "></div></th>
                <th><div class="fht-cell" style="width: 97px; "></div></th>
                <th><div class="fht-cell" style="width: 82px; "></div></th>
                <th><div class="fht-cell" style="width: 101px; "></div></th>
                <th><div class="fht-cell" style="width: 93px; "></div></th>
                <th><div class="fht-cell" style="width: 86px; "></div></th>
                <th><div class="fht-cell" style="width: 88px; "></div></th>
                <th><div class="fht-cell" style="width: 72px; "></div></th>
                <th><div class="fht-cell" style="width: 84px; "></div></th>
                <th><div class="fht-cell" style="width: 84px; "></div></th>
                <th><div class="fht-cell" style="width: 105px; "></div></th>
                <th><div class="fht-cell" style="width: 46px; "></div></th>
                <th><div class="fht-cell" style="width: 61px; "></div></th>
                <th><div class="fht-cell" style="width: 81px; "></div></th>
                <th><div class="fht-cell" style="width: 61px; "></div></th>
                <th><div class="fht-cell" style="width: 61px; "></div></th>
                <th><div class="fht-cell" style="width: 94px; "></div></th>
                <th><div class="fht-cell" style="width: 92px; "></div></th>
                <th><div class="fht-cell" style="width: 73px; "></div></th>
                <th><div class="fht-cell" style="width: 69px; "></div></th>
                <th><div class="fht-cell" style="width: 103px; "></div></th>
                <th><div class="fht-cell" style="width: 133px; "></div></th>
            </tr>
        </thead>
        <tbody>
                <tr>
                    <td style="height: 161px; width: 99px; "></td>
                    <td style="height: 161px; width: 97px; "></td>
                    <td style="height: 161px; width: 38px; "></td>
                    <td style="height: 161px; width: 97px; "></td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                    <td></td>
                </tr>
        </tbody>
        <tfoot>
            <tr>
                <th></th>
                <th></th>
                <th></th>
                <th></th>
                <th></th>
                <th></th>
                <th></th>
                <th></th>
                <th></th>
                <th></th>
                <th></th>
                <th></th>
                <th></th>
                <th></th>
                <th></th>
                <th></th>
                <th></th>
                <th></th>
                <th></th>
                <th></th>
                <th></th>
                <th></th>
                <th></th>
                <th></th>
            </tr>
        </tfoot>
    </table></div></div></div>
    </div>

it breaks unless height stated explicitly

jeffersonbezerra · 2015-06-05T12:23:59Z

no one fixed this yet?

solenovex · 2017-08-25T06:50:13Z

still no one fixed this yet?

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

fixedColumn not freezing first column, fixedColumns:2 hiding table #27

fixedColumn not freezing first column, fixedColumns:2 hiding table #27

gregpinero commented Dec 20, 2011

markmalek commented Jan 12, 2012

xeromorph commented Jan 13, 2012

jeffersonbezerra commented Jun 5, 2015

solenovex commented Aug 25, 2017

fixedColumn not freezing first column, fixedColumns:2 hiding table #27

fixedColumn not freezing first column, fixedColumns:2 hiding table #27

Comments

gregpinero commented Dec 20, 2011

markmalek commented Jan 12, 2012

xeromorph commented Jan 13, 2012

jeffersonbezerra commented Jun 5, 2015

solenovex commented Aug 25, 2017