CODEWITHSUNDEEP
jquerydatatabledatatablesdatatables-1.10
Alphy
Alphy

Reputation: 331

How to set dfferent fixed columns datatable

I would like to set fixed columns on scroll with data tables, say I have a column at index 1,10,15. On horizontal scroll, I need to be able to set those as fixed. At the moment I am only able to set only the first column to be fixed.

  1. Work for the first column

    $('#example').DataTable( {
fixedColumns: true

    } );

  2. Works for the first two columns

    $('#example').DataTable( { fixedColumns: { leftColumns: 2 } } );

How do I fix the 1,10,15

I tried

$('#example').DataTable( {
    fixedColumns: {
        leftColumns: [1,10,15]
    }
} );

Example

 table columns = > |1(freeze) | 2 |... |10(freeze)|....|15(freeze)|

Any suggestions

Upvotes: 0

Views: 2934

Answers (2)

MyTwoCents
MyTwoCents

Reputation: 7624

As per Datatable's Doc

You can add Fixed Columns in both Left and Right and it even allows multiple Columns.

Catch is all columns have to be continous.

Unfortunately fixing column in middle is not allowed. Due to its complexity. Read Doc above

Sample Code

$(document).ready(function() {
    var table = $('#datatbleId').DataTable( {
        scrollY:        "300px",
        scrollX:        true,
        scrollCollapse: true,
        paging:         false,
        fixedColumns:   {
            leftColumns: 2,
            rightColumns: 3
        }
    } );
} );

More detail here

Working Fiddle

Upvotes: 3

Fryann Martinez
Fryann Martinez

Reputation: 408

You might try this to fix the column in your js .

$(document).ready(function() {
    var table = $('#example').DataTable( {
        scrollY:        "300px",
        scrollX:        true,
        scrollCollapse: true,
        paging:         false,
        fixedColumns:   {
            leftColumns: 1,
            rightColumns: 1
        }
    } );
} );

Upvotes: 1

Related Questions