Table size altering while filtering on fixed column

rahulcapgemi

Hello All

Issue is : We are using fixed column in our data Table . whenever we tried to filter any values, internally some style has been added and changed the height of colum. After filtering,table is not resized .

If I removed the fixed column its works fine .

var oTable = $("#hfLibTable").DataTable({
  // This dom setting moves the "showing n entries" row before the
  // search box, and adds Buttons for save, copy, and print
  "dom": "Britp",
  buttons: [{
      extend: 'excel',
      text: "Save to xls",
      "filename": filename,
      exportOptions: {
        columns: [':visible']
      }
    },
    {
      extend: 'csv',
      text: "Save to csv",
      "filename": filename,
      exportOptions: {
        columns: [':visible']
      }
    },
    {
      extend: 'copy',
      text: "Copy to clipboard",
      exportOptions: {
        columns: [':visible']
      }
    },
    {
      extend: 'print',
      text: "Print",
      exportOptions: {
        columns: [':visible']
      }
    }
  ],
  "scrollY": "400px",
  "scrollX": "100%",
  "scrollCollapse": true,
  "paging": false,
  "fixedColumns": true,
  "order": [
    [0, 'desc']
  ],
  // Default descending sort on column 0.
  //"order": [[0,'desc']],
  // num-html is a special numeric sort after stripping off html from
  // the column. It requires the datatables.numericHtml.js plug-in.
  // NOTE: if you add any columns here, go up and change the index used in the
  // filterver change function above.
  "columns": [{
      "orderData": [1]
    }, //id
    {
      "visible": false
    }, //invisible id for export
    {}, //state
    {}, //owner
    {}, //qa
    {}, //release date
    {}, //to qa date
    {}, //qa est completion date
    {
      "type": "natural"
    }, //supersedes
    {
      "type": "natural"
    }, //vdp version
    {}, //product
    {}, //required
    {
      "type": "natural"
    }, //includes required
    {}, //bug #
    {}, //bug type
    {}, //component
    {}, //customers
    {
      "orderable": false
    }, //use and notes
    {
      "orderable": false
    }, //download link
    {}, //released in
    {}, //install with
    {} //same as
  ]
});

Plain text
1
2
3
4

$('.search_init').on('keyup change', function() {
 console.log("this is keyup change");
  oTable.column($(this).data('thindex')).search(this.value).draw();
} );

colin

Hi @rahulcapgemi ,

Is this the same issue as this thread? It looks like you've started a second one?

Cheers,

Colin

rahulcapgemi

yeah its a same issue

rahulcapgemi

Hello All,
Below url having a proper method to resolve issues

https://datatables.net/extensions/fixedcolumns/examples/initialisation/css_size.html