How to update leftColumns after init?

How to update leftColumns after init?

nilsringersmanilsringersma Posts: 2Questions: 1Answers: 0

Hello everyone,

I was hoping to get some tips on how to update fixedColumns 'leftColumns' programmatically.

Description
On the initial pageload I init dataTables and fixedColumns like this, it's working just fine:

var table = $('.overview-table__table').DataTable({
  fixedColumns: {
    leftColumns: 2,
  },
  scrollX:      true,
});

Question
Now I was looking to update the value of leftColumns on certain events. I'm having some problems doing just that. From the documentation I can't find an api option to alter the fixedcolumns or leftcolumns property. I was working on changing dataTables settings, destroying and rebuilding. However that does not feel like a good solution.

Any change someone can offer me some tips on how to update the fixedColumn settings programatically?

Answers

  • colincolin Posts: 15,237Questions: 1Answers: 2,599

    When you update the column, do you mean the value? If so, you can use cell().data() for that - see here.

    Colin

  • nilsringersmanilsringersma Posts: 2Questions: 1Answers: 0
    edited August 2020

    Hi Colin,

    Thanks for your reply! Sorry for being a bit vague.

    Context
    Users can click columns to make them sticky. What this does is moving the column all the way to the left. I already implemented this with the colReOrder extension. I would love to make those 'sticky' columns fixed. So that when they scroll horizontally this column remains visible.

    Problem
    I know that on init of the datatable I can set the amount of fixed columns with the 'leftColumns' setting. That also works, but on init I have no idea which cols the user wants to be sticky. Therefor I need to do this dynamically after a user makes a column sticky. I haven't been able to find a way to do this and i reckon my only possibility is to destroy the entire table and set it up again with the columns sticky (custom column order) and the left columns setting.

    Question
    Basically the thing I look for is a way to alter the 'leftColumns' setting so that I can add or delete columns from the fixed position. Because the api documentation does not show a method doing just that am I correctly assuming I need to destroy my table? Or would there be another way to change the settings (particularly the 'leftColumns' setting) of my datatable and rebuild it?

    Does that make more sense :D?

  • colincolin Posts: 15,237Questions: 1Answers: 2,599

    Therefor I need to do this dynamically after a user makes a column sticky.

    The only way to do that would be to make re-initialise the table, using destroy on the previous one, and declare the new columns that are to be sticky.

    Colin

  • ChrisnChrisn Posts: 1Questions: 0Answers: 0

    I'm currently at the same problem. Here is what I did so far:

    table.api().colReorder.move(index, newIndex)
    options.fixedColumns.leftColumns++
    table.api().destroy()
    table.DataTable(options)
    

    So a user can make a column sticky to the left. But now I want to add another row which leads to the next problem. The new table has lost its original indexes, so the new row has the wrong column order.
    It would be great if there is an API to change the number of fixed columns dynamically

This discussion has been closed.