Drag&Drop Column causes the sorting event to be activated in Firefox (Chrome and Edge works fine)

Drag&Drop Column causes the sorting event to be activated in Firefox (Chrome and Edge works fine)

jinyjosejinyjose Posts: 3Questions: 0Answers: 0

Hello,
If the ColReorder and scrollY / scrollX Option are used together, then in Firefox Browser, when one column is dragged and dropped, it automatically sorts the column as well. However, this behaviour is not present in Chrome and Edge Browsers. Is there any way to prevent the sorting function from being activated while dragging and dropping the column.

The effect can be seen in this example : https://datatables.net/extensions/colreorder/examples/initialisation/scrolling.html

Thanking you in advance.

Best regards,
Jiny Jose

Replies

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

    Ah, odd, it must be a new 'feature' of FireFox. I've raised it internally (DD-2470 for my reference) and we'll report back here when there's an update.

    Cheers,

    Colin

  • jinyjosejinyjose Posts: 3Questions: 0Answers: 0

    Hello Colin,
    Thankyou for the reply. I would like to enquire if there are any updates for a fix for this problem.

    Best regards,
    Jiny

  • allanallan Posts: 63,489Questions: 1Answers: 10,470 Site admin

    Hi Jiny,

    I've just been digging into this, but I've been unable to determine a workaround. I'm reasonably certain that it is something Firefox is doing with the stacking of the elements. For example, using the example you gave:

    1. Click and drag Position so that when you release the mouse it is over the table header's Position header cell (ignore the floating element) - it sorts.
    2. Now reload the page and click and drag Position so that when you release the mouse now the cursor is not over the original Position header cell. It doesn't sort!

    There is no way that I've found to have ColReorder's mouseup prevent the click on the header cell when in the first case. DataTables puts a regular event on the th while ColReorder uses a document level event for the mouse up (it needs to in case the mouse is moved quickly and is outside the dragging element when released).

    I don't have a fix for this I'm afraid. I'm also not sure how we'd provide the Firefox team with a simple example showing this since there seems to be a bunch of stuff going on (it needs the DataTable to have scrolling enabled for example).

    Best I can offer is that at some point I plan to add a drag handle element to the header so that is the only place where you can click and drag to reorder the columns. That should solve it, but is likely some way off.

    Allan

  • jinyjosejinyjose Posts: 3Questions: 0Answers: 0

    Hi Allan,

    Thankyou for the reply.

    The suggestion that you provided to add a drag handle emement so that the only option for the user to click and drag the columns is the header area, would be great as well. Could you please let know when this is implemented.

    Thanking you again for the support!

    Best regards,
    Jiny

  • allanallan Posts: 63,489Questions: 1Answers: 10,470 Site admin

    Its an old one this, sorry, but as an update, I've just done a rewrite of ColReorder which will be released as v2 alongside DataTables 2 in the new year (January probably). The rewrite does not have the effect you mention - I think in large part due to how DataTables and ColReorder handle the events and the ordering of the listeners. I can happily start a drag of a column, then release it and it doesn't trigger an order on that column.

    Allan

Sign In or Register to comment.