multiple-select filter and scrollX css problem

multiple-select filter and scrollX css problem

PiotrekneoPiotrekneo Posts: 4Questions: 3Answers: 0
edited May 2015 in Free community support

Hi all !

I use multiple-select (http://wenzhixin.net.cn/p/multiple-select/docs/) filter in my datatables.
I wrote this code to do this :

this.api().columns().every(function ()
{

                        var column = this;


                        var select = $('<select multiple="multiple" style="width:inherit"><option value=""></option></select>')

                            .appendTo($(column.header()).empty())

                        select.append('<option value="value1">value1</option>')
                        select.append('<option value="value1">value1</option>')
                        select.append('<option value="value1">value1</option>')
                        select.append('<option value="value1">value1</option>')
                        select.append('<option value="value1">value1</option>')
                        select.append('<option value="value1">value1</option>')

                        select.multipleSelect({
                        });
                        });

I uploaded picture to : http://postimg.org/image/ys0q3ajxx/ which exactly describes my problem.
Everything is fine and works like a charm.

But problem appears when I use 'scrollX' = true option -> It is needed because I have more than 20 columns to display sometimes !

Problem appears that when I click on this "select" -> the list appears but it is covered by "datatables body rows". This problem does not occur when I use "standard select".

I suppose that this problem is connected with "Css styling", but I do not know how to correct this.

When I turn off "scrollX" option, my multiple-select works fine -> List appears "on the top" of the datatables body, but when "scrollX" is turned on -> this list is covered by "datatables body".

Could you help me how to fix it ?

Answers

  • daniel_rdaniel_r Posts: 460Questions: 4Answers: 67

    you can try out my yadcf plugin, among other features it support scrollX and scrollY , see showcase http://yadcf-showcase.appspot.com/

  • PiotrekneoPiotrekneo Posts: 4Questions: 3Answers: 0

    Hi Daniel,

    Thanks for your answer. I very appreciate and glad of your plugin, but I would prefer "my" multiple-select which I described above (wenzhixin), because it looks like "excel" filtering and I need it in my implementation.

This discussion has been closed.