How to Resizing columns

CountLessQ

I have this code sample that is supposed to resize columns. However the option is there but the columns doesn't get resized.
live.datatables.net/lukajoqo/1/edit

kthorngren

ColReorderWithResize.js is a third party plugin that isn't supported by Datatables. The docs can be found here:
https://github.com/jeffreydwalter/ColReorderWithResize

I've seen other posts with mixed results using this plugin. The developer of the library would be the one to support it. But it doesn't look like the developer plans to do much more with it.

It does look like you are loading a very old version from 2012. Open the JS file to see when it was last modified. It does look like the developer last updated the JS 3 months ago with updates to work with Datatables 1.10. You may want to try that.

However it probably won't work properly with FixedHeader as FixedHeader clones the original header and hides the original. It's not attached to the table so it probably will allow fo resizing of the header only.

Kevin

CountLessQ

I tried the latest version 3.0
it seems the issue is here, even without fixed header:

      $('#example thead tr').clone(true).appendTo('#example thead');
                $('#example thead tr:eq(1) th').each(function (i) {
                    var title = $(this).text();
                    $(this).html('<input type="text" placeholder="(All)" />');

                    $('input', this).on('keyup change', function () {
                        if (table.column(i).search() !== this.value) {
                            table
                                .column(i)
                                .search(this.value)
                                .draw();
                        }
                    });
                });

http://live.datatables.net/lukajoqo/4/edit
if I remove this part the resizing work as needed. Is there a way to edit my js or css so the input boxes does not affect the plug in. Is that still a question to the plug in owner.
thank you

kthorngren

if I remove this part the resizing work as needed.

That suggests the ColReorderWithResize plugin doesn't support multiple headers. One option might be to move the search inputs to the footer. The only other I can think of is to update the resize code in ColReorderWithResize.js to support the two headers.

Kevin