ColReorder in Multi-row Head

fruedadev

Hello,

I have the table you can see in this test case, a table with 2 rows in the header, one of them for filtering each column. The problem I have is that I am able to reorder the columns, clicking on any of these rows. But that:

1. Is not desirable.
2. Even if it would (I think we could live with that), if you click into the filter textbox, it selects the table's content while moving the mouse to reorder the column.

Is there any option in ColReorder to specify the exact row to be clicked? Or programmatically, if there's no option for that?

Thanks in advance.

allan

Good idea! There was no option for that in ColReorder, so I've gone ahead and added a new colReorder.headerRows option which is an array of the row indexes in the header to receive the click and drag listener. This is the commit.

It will be in the nightly build shortly .

Allan

fruedadev

I've so far workarounded it using the following code after the datatable initialization:

    $('#datatable thead tr:nth-child(2) th').off('mousedown');

It works, and it's simple, but I'm wondering if there's another way to do it.

allan

That looks good. The alternative is to use the change I committed earlier today.

Allan

slolo

Hello,

I am currently experiencing this problem since migrating from v1.13.10 to v2.2.2

Is there any chance this change will be made available in production since it was released in January?

Also, in the example above, I can see the property "orderCellsTop: true,"
As mentioned here https://datatables.net/reference/option/orderCellsTop this property is deprecated.

So, what is the way to remove this property and avoid the behavior?

kthorngren

@slolo The new colReorder.headerRows was created to address this issue. Looks like it was added to ColReorder 2.1.0 but only 2.0.4 is available in the Download Builder. @allan can comment on when 2.1.0 will be released.

I think @allan is reconsidering the deprecation of orderCellsTop. Maybe the docs need updated. I think you are safe using orderCellsTop for the foreseeable future.

Kevin

allan

Yes - orderCellsTop is going to be superceeded in DataTables 2.3 by a new titleRow option. However it will be backwards compatible and orderCellsTop will continue to work for at least the 2.x series (the backwards compatibility for it is just a line or two, so I don't feel under any need to drop it any time soon).

This was the main commit for the new option, including the docs.

Hoping to drop 2.3 next month.

Allan

kthorngren

Thanks for updating the orderCellsTop deprecation note. The titleRow option looks like a good option!

Kevin

slolo

Thanks a lot @allan for the news.

I have down 2 small examples here:
- With Datatables 1.13.11: https://live.datatables.net/vuqajexa/1/edit
- With Datatables 2.2.2: https://live.datatables.net/gutiwuca/1/edit

The example with v1.13.11 works well and you cannot move columns header on the first row (the filters row)

But in the example with v2.2.2, you can drag and drop a column even on the first row by dragging input field.

I have tested with the nightly build and the new option "colReorder": { headerRows: [1] } (see comments in source code) and it works very well.

I suppose there is nothing to do to correct this behavior expect using the @fruedadev tips:

$('#datatable thead tr:nth-child(2) th').off('mousedown');

Are you waiting to release Datatables v2.3 to release ColReorder v2.1?