DataTables logo DataTables

via Ad Packs
FixedColumns: New plug-in for DataTables - fix columns when scrolling
  • wjshohswjshohs
    Posts: 29
    I applied here http://213.108.45.42:88/reports/matchedproducts/ fixed with 2 columns but
    1) Why do they have transparent layer?
    2) Whey have wrong width
  • allanallan
    Posts: 15,874
    The transparency is simply because they have a transparent background :-). Just add a background-color using CSS to remove that.

    For the widths - first suggestion is to upgrade to the latest release, rather than 1.7.0 which is a little out of date now.

    Allan
  • wjshohswjshohs
    Posts: 29
    The transparency I fixed. I updated 1.7.4 - but the bug staied about wrong width

    also please answer there - http://datatables.net/forums/comments.php?DiscussionID=2899
  • wjshohswjshohs
    Posts: 29
    also I found that after i add width parameter there <th width="20"> - after datatable generate table - it changes width into the style. and this is more priore for html. how could I turn off width into the style for cells and thead?
  • pixelfxpixelfx
    Posts: 10
    Hi Allan,

    Your plugin is really really useful. Thanks a ton. I was a looking for this script from past 3months but i couldn't get one. I have few questions on the example you have posted on http://baldwindavid.github.com/datatables_test/.

    1). When i am doing a horizontal scroll, why the locked column flickers.(jerking effect) in FF|IE-6|7|8. But on chrome the scrolling is very smooth. Can you please look into this.

    2). How do i freeze more than 2 cols.
  • greenflashgreenflash
    Posts: 27
    On the flickering scrolling, I've noticed that the fixed column only flickers when scrolling horizontally if you're using vertical scrolling. If you're using pagination and no vertical scrolling there's no flickering.

    Campbell
  • allanallan
    Posts: 15,874
    An update coming soon which will address this... :-)

    Allan
  • greenflashgreenflash
    Posts: 27
    Good news! Thanks.

    The other thing I've noticed, which is perhaps related to this, is that when you're using fixed columns and vertical scrolling, you don't get the nice blue line down the column boundaries to give you feedback as to where you're about to drop a column being moved - whereas you do when you're using paging.

    Campbell
  • greenflashgreenflash
    Posts: 27
    One more thing I've noticed, which again may possibly be related to this, is that the "Processing ..." message doesn't appear during sorting when you're using scrolling - only if you're using paging. (Actually that's not 100% correct: it doesn't appear either if you're using paging and have the show length set to -1.)

    Campbell
  • allanallan
    Posts: 15,874
    when you're using fixed columns and vertical scrolling, you don't get the nice blue line down the column boundaries to give you feedback as to where you're about to drop a column being moved

    Is that when using ColReorder? I'll look into that.

    For the processing message - are you using server-side processing? Or just regular sorting. How long does the sort take?

    Allan
  • greenflashgreenflash
    Posts: 27
    Yes, sorry, I should have said - it's when using ColReorder.

    For the processing message, no I'm not using server-side processing, I'm just using regular sorting. The sort doesn't take long - a second or so. On fast browsers you don't see the processing message at all, but on slower ones such as IE you do. And when I'm using IE6 on a Virtual PC it takes ages ...! [By the way, it took me a while to figure out how to get the processing message at all. I solved it by setting the z-index in the CSS]

    Campbell
  • estheresther
    Posts: 2
    Hi Allan,
    Thanks to Your plugin,it is really useful.
    Now when I use FixedColumns example - rowspan in the header,I notice a bug such as"that.s.dt.aoColumns[iColumn].anThExtra is undefined"in every browser.
    Pls tell me how should I resolve the bug as soon as possible?
    Tks a lot!
  • estheresther
    Posts: 2
    Hi Allan,
    Thanks to Your plugin,it is really useful.
    Now when I use FixedColumns example - rowspan in the header,I notice a bug such as"that.s.dt.aoColumns[iColumn].anThExtra is undefined"in every browser.
    Pls tell me how should I resolve the bug as soon as possible?
    Tks a lot!
  • allanallan
    Posts: 15,874
    When using DataTables 1.8 you need an updated version of FixedColumns to do rowspan in the header. You can get the nightly version from here: http://datatables.net/download/ . This will be made into a release soon.

    Allan
  • dmartinezdmartinez
    Posts: 13
    hi everyone, im using fixedColumn with a table, but i have a problem with horizontal scroll bar.. i need fixed the position of the horinzontal scroll when the page reload.. i found how to do that with vertical scroll using bstatesave (just for vertical scroll), but i need the same for the horizontal scroll. can someone help me please??
  • thilagathilaga
    Posts: 1
    Hi Allan ,
    I need the browser history feature for pagination and sorting for my application.
    Can you please advise on this?
  • allanallan
    Posts: 15,874
    Hi thilaga,

    An interesting idea for a plug-in. It would be possible using fnDrawCallback to effectively force the page onto the browser's history stack, but it might involve a little bit of work to get it to work fully. An extension would be to include filtering and sorting as well - but that might be a step to far :-). I'd suggest looking at fnDrawCallback initially.

    Allan
  • nithyanithya
    Posts: 1
    Allan, i too have this problem . i need to implement the browser history for DataTables soon. Can you explain it in more detail as i am newbie . Thx in advance.
  • pinkk58pinkk58
    Posts: 3
    Hi,
    I am using fixed header and columns data table plug in. In my table there are large no of rows and columns. so while loading the page error comes "stop script". so please suggest me to solve this error or suggest changes to be made so that I can use this plug in for large no of cells. please help me out.
    Thank you.
  • allanallan
    Posts: 15,874
    @pinkk58: Its not an error really - its a simple fact that it takes a lot of calculation to do what FixedColumns does. This example shows how FixedColumns can be speed up significantly: http://datatables.net/release-datatables/extras/FixedColumns/css_size.html (but at the cost of having all rows as equal height, which might or might not be acceptable to you).

    Allan
  • pinkk58pinkk58
    Posts: 3
    Thank you Allan for reply. I applied the css, But still its throwing an alert saying continue with script or stop script. if I click on continue script it shows the output but if I click on stop script it wont display the fixed columns text. How can we avoid that alert box?
    Thank u,
    Regards,
    Pinkk58
  • rikoona101rikoona101
    Posts: 1
    Hello,

    Im really new to this and I find it interesting to use,

    How will I maintain the width of the column after editing it using jeditable?.

    Because after editing it, the column is adjusting to the length of the new value. T_T,

    Any help is highly appreciated, or I might missed something from the examples.

    Thanks in advance,

    All the best,

    Riko
  • allanallan
    Posts: 15,874
    @pinkk58: I've just seen that the demo code that you can see on the page is slightly wrong. The code which is running the page is correct, but you need this:

    new FixedColumns( oTable, {
	"sHeightMatch": "none"
} );

    Have you got that? That will speed things up. It might not speed things up enough in fairness. How many rows are you trying to show? Bare in mind that FixedColumns is complex and what it does requires a lot of processing. If there was a magic fix to make it go faster, I'd put it in :-)

    @rikoona101: Can you start a new thread please? This one is about FixedColumns.

    Allan
  • pinkk58pinkk58
    Posts: 3
    Hi Allan,
    here is the code . Have put it already. Still its giving me the same error. Could you please suggest any solution to remove the alert box saying"Please stop the script"?
    tr { height: 50px; }
    <script type="text/javascript" charset="utf-8">
    $(document).ready( function () {
    var oTable = $('#t1').dataTable( {
    "bPaginate": false,
    "bSort": false,
    "bAutoWidth": false,
    "sScrollY": "400px",
    "sScrollX": "100%",
    "bScrollCollapse": false,
    "bSortClasses": false,
    "bFilter": false,
    "bJQueryUI" :true,
    "bAutoWidth" :false,
    "bProcessing" :true,
    "bRetrieve": true,
    "bSortClasses": false,
    "bInfo": false,
    "bSearchable": false
    } );
    new FixedColumns( oTable, {
    "iLeftColumns": 3,
    "sHeightMatch": "none"
    } );
    } );

    </script>
    Thank you,
    Regards,
    Pinkk58
  • allanallan
    Posts: 15,874
    How many rows do you have in your table? The warning is shown after a certain amount of time that the browser has been processing a Javascript "thread", or in the case of IE a certain number of operation executions. Its not something that I can control other than to try and optimise FixedColumns and DataTables - and as I mentioned, if I knew what further optimisations I could put in, I most certainly would!

    One think that would certainly stop the number of operations being too high is to enable paging, since it would then only have to clone 10 rows at a time, rather than however many you currently have.

    Allan
  • sumit91sumit91
    Posts: 3
    i try printing the information All the columns are visiblle Except Fixed column. Any ideas on that ??Same goes if i try to get PDF of the same . First column is overlapped on the second column. Would like to know if there is some setting that can be done to make it working?
  • sumit91sumit91
    Posts: 3
    Same problem happening with rowGrouping as well using Fixed columns ..
  • bpelhosbpelhos
    Posts: 3
    Just some tips for the web designers, specially for IE8:
    * Don't add top or bottom border to the header (the header cells in the fixed part will have 0 border width, so the header cells in the scrolled part will be higher)
    * Don't use different top or bottom border widths in the data cells of a row. Otherwise every oFC.fnUpdate() or oFC.fnRecalculateHeight() with sHeightMatch=auto setting will rise the height of the data row with some pixels. (It makes you trouble if you update the cell values dinamically and need several table redraw.)

    Took me 1 day to figure out :)
  • allanallan
    Posts: 15,874
    Good information to know - thanks very much for sharing it! There are certainly a few little bits and bobs that can throw FixedColumns off course - basically, as you were seeing, the fixed table and the scrolling one much has identical styles applied to them or all bets are off!

    Regards,
    Allan
  • nickgnickg
    Posts: 3
    Hi Allan,

    I've been working with the FixedColumns plugin and have come across an issue I think may be related to some past posts here:

    http://datatables.net/forums/discussion/comment/12347#Comment_12347
    http://datatables.net/forums/discussion/comment/12353#Comment_12353
    http://datatables.net/forums/discussion/comment/12539#Comment_12539
    http://datatables.net/forums/discussion/comment/12539#Comment_12539
    http://datatables.net/forums/discussion/comment/12936#Comment_12936
    http://datatables.net/forums/discussion/comment/22036#Comment_22036


    The issue relates to the previously mentioned issue with multiple tr's in the header. When you have more than one tr, with the first tr contains grouping (colspan) labels,
    on sort FixedColumns does not change the class "sorting_asc", "sorting_desc", or "sorting" on the correct tr. Instead, it changes it on the first tr. This is easily seen by clicking on a couple th's to
    sort in the example i've put together here (as the sort_asc, sort_desc, and sort_both image changes on the first tr): http://jsfiddle.net/edvEs/30/

    As we use this class to maintain sort order for printer friendly pages, it is important that this class changes properly. I have a hack fix which works for now (http://jsfiddle.net/mmrjp/4/), but it isn't very clean.
    This occurs on both firefox and IE7, and I have tried the regular 2.0.2 release version (http://datatables.net/download/build/FixedColumns.js), the nightly release version (http://datatables.net/download/build/FixedColumns.nightly.js), and the raw github version (https://raw.github.com/DataTables/FixedColumns/master/media/js/FixedColumns.js), just to make sure it wasn't fixed, since I saw some comments earlier about possible fixes.

    Is this an issue that would be easily fixed, or one of the harder to fix issues mentioned here: http://datatables.net/forums/discussion/comment/12353#Comment_12353

    Thanks,
    Nick
  • allanallan
    Posts: 15,874
    Hi Nick,

    Thanks very much for the details and providing a JSFiddle test case! I've just updated the algorithm that FixedColumns uses to copy the classes to be a lot more complete and committed the change, which is now part of FixedColumns 2.0.3.dev ( http://datatables.net/download ). I've updated the test case here: http://jsfiddle.net/edvEs/35/ .

    It should now be able to cope with multiple rows, rowspan and colspan (as long as the colspan doesn't overleapt the fixed / non-fixed parts of the table of course!).

    Thanks for posting about this - a nice enhancement to FixedColumns I think :-)

    Regards,
    Allan

    p.s. duplicates gone :-)
  • rameshramesh
    Posts: 2
    Hi,
    Fixedcolumn working fine in my table but i have a problem with that,is before fixed column i made if we click on any one row, that perticular row will move to first row position and first row position will arange second positon,if i deselect same row, that row will go original position,that functionslity not working if i integrate fixed column,pls help me
This discussion has been closed.
← All Discussions

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

Sign In Apply for Membership

Support

Get useful and friendly help straight from the source.

Categories

In this Discussion