smasala / colresize Goto Github PK

When using the stateSave Datatables functionality would like the column sizes saved so when the user expands or shrinks the column size it will remember those settings the next time the table is initialized.

Hi
Can you maybe give me some pointer what to change in case I just want to change/resize the percentage distribution of the table columns?

Background is that I do not want vertical scrollbars and always fit everything into the cells (with ellipsis or line breaks depending on the cell), however it would be great if the user could change the size distribution.

The table is already setup with percent-wise column widths.

Google Chrome 71

Issue appears with stateSave: true (both DT and colResize) and with colresize`s scrollY: true:

$('#content-table').DataTable( {
    colResize: {
        scrollY: 500,
        minColumnWidth: 50,
        stateSave: true
    },
    autoWidth: false,
    scrollX: false,
    stateSave: true
} );

This causes inconsistency after page reloads: only the header width got saved, but not column width.
Disabling scrollY under colResize fix this behaviour but the table is no longer scrollable.

See here.
https://jsfiddle.net/bababalcksheep/ftmsp3rg/

It will be helpfulll if all datatables plugins and styles are supported and shown in demo as well

Steps to reproduce:

In your demo https://smasala.github.io/ColResize/, in the 2th table.

1. drag the right border of the JOB column, out of the table right border.
2. scroll the table with the X scroller.
3. drag the left border of the JOB column..

I will submit a PR to fix it.

[sory for my bad english]

While playing with the demo I noticed that if you grab a bar and drag it, it doesn't quite stay insync with the columns. To see, pick up the bar between the first and second columns and then drag it all the way to the left, then as far as possible to the right (blocked by the next bar - nice touch!). The sorting icon can now be seen to the right of the drag bar. If you use the inspect you can see a bit more easily the cells not lining up with the bars.

I suspect its a sub-pixel rendering issue. On each mouse move there is just a small offset which is gradually adding up. One option might be to use getBoundingClientRect() which will get sizes with sub-pixel precision, while another option might be to redraw the bars to match the columns when mouseup is triggered (although not quite as nice UX).

One way or another - this is superb and easily the best column resizing I've seen for DataTables!

Hi,
Thanks for a great plugin.

I'm trying to create ColResize with tabs but only working on the first active tab. Here is the example https://codepen.io/yurenlimbu/pen/PMwzEy?editors=1010.

Using scrollY option in the plugin prevents clicking on actual table.

Strange side effects when zooming on the page with CTRL + '+' see: #2 (comment)

Using the tfoot tag in the table causes the DataTable to break when using this plugin.

Example: https://jsfiddle.net/bababalcksheep/ftmsp3rg/

Current workaround: use the DT Footer callback: https://datatables.net/examples/advanced_init/footer_callback.html

I'm running into an issue with ColResize when using the plugin within a single page Vue application.

It appears that the plugin is holding something from the table in memory, and each time a DataTable within the application is visited, the memory size grows by the table size, but it is not released when the table is navigated away from.

The table is being properly destroyed, but something within ColResize is holding onto memory references within the table, and causing a memory leak.

I've tried adding additional calls in the destroy() function within the plugin to try to remove more listeners and null more objects, but I'm not having any success.

Wanted to see if anyone had any issues like this in the past or any guidance about how ColResize allocates memory.

Please add support for tables with "direction:trl" style.

Hi,
Thanks for a great plugin. I'm unable to set 100% width on the table here is the issue https://codepen.io/yurenlimbu/pen/YgwemY. I want to create full width as parent div. How can I set this?

Hi,

I have about 90 columns in a table. Since it is made according to the width of the area, 90 columns come together and are not read In addition, sizing is not possible on the width stably.

While implementing select all in check box in the datatable , then the sort option is enabled in table header and also automatically removing the select all option in checkbox once its data loaded from backend and also we made the data orderable is false to fix this issue but its is not working with colresize and also not adapting column defs in datatable.

https://jsfiddle.net/82dp0fjt/2

Enhancement Request

Please add option to disable real-time drag (live drag). Because it is performing slower specially when dealing with huge or extremely complicated tables.

I have created jsFiddle of other third party jQuery plugin which is having same feature.
http://jsfiddle.net/eLm6ugp7/183/

Thanks,
Tanmay

Hello Team,

I want to integrate Column resize functionality into my react data table. Is it possible ? If it's possible , How can i import?