Bootstrap-Select issue with fixed table columns

Bootstrap-Select issue with fixed table columns

curioucuriou Posts: 39Questions: 10Answers: 0

Having an issue where initializing a select input (Bootstrap-Select plugin) in the header of a fixed column causes the fixed table columns (first two on the left) to be slightly misaligned with the rest of the table columns. The cloned table layers that DataTables creates when the FixedColumns option is active are also misaligned (try scrolling down and hover over the fixed column).

A second issue is that the options in the fixed column select input are not clickable/selectable (works fine in the other columns). It's as if an element is blocking the select event from being triggered(?).

The issues begin as soon as the Bootstrap-Select select inputs are initialized:

//Initializing Bootstrap-Select select inputs (fixed column select input gets populated but dropdown shows as empty)
$('select').selectpicker({container: "body"});

//In order for select input in fixed column to show its content in the dropdown, you have to refresh (but content is still not clickable/selectable)
$('#fixed').selectpicker('refresh');

Test case: http://live.datatables.net/cezotiyu/1/edit

Am aware that this question may require prior knowledge of Bootstrap-Select, but in the event that the issue looks familiar to any CSS/JS wizes out there, any help/tips for debugging would be greatly appreciated.

Thanks

Answers

  • allanallan Posts: 61,446Questions: 1Answers: 10,054 Site admin

    You can't use a CSS :hover with FixedColumns I'm afraid. Because the frozen column is cloned and put into another table element, a :hover will only apply to the row for the host table or the frozen table. Not both.

    The only way to address that would be by using Javascript to add / remove classes that effectively do the same thing as the hover, but that's not something that FixedColumns currently doesn't I'm afraid (although I've just filed an enhancement request in our tracker for this, DD-1394).

    Regarding the misalignment, this is what I'm seeing:

    That looks okay I think?

    Allan

  • Wizard85Wizard85 Posts: 9Questions: 2Answers: 0

    I need something like this example, but for the fixed column the select is not working.
    Why the fixedColumn plugin needs to create an overflow cloned table?

  • kthorngrenkthorngren Posts: 20,144Questions: 26Answers: 4,736

    @Wizard85 Colin answered your question in this thread. Please post a new thread if you still have questions.

    Kevin

This discussion has been closed.