Search code examples
javascriptjquerytwitter-bootstrapdatatablesz-order

DataTables row moving behind bootstrap modal using RowReorder

I´m using DataTables on a Bootstrap modal window, and when I implement the RowReorder Extension works fine, except that the row following the mouse pointer occurs behind the modal. Is there a way to set that up so I can see the row moving in front of the screen over the modal window? Something like z-order or so? Thank you very much in advance.

Solution

  • By default a bootstrap .modal have z-index: 1050 and the .modal-backdrop a z-index: 1040. So all you have to do is to ensure the z-index for the RowReorder floating element has a higher rank :

    table.dt-rowReorder-float {
    z-index: 2000;
}

    demo -> http://jsfiddle.net/L82z0jgj/