Option orderCellsTop pulls also drop box to top header row

Option orderCellsTop pulls also drop box to top header row

Murphy013Murphy013 Posts: 15Questions: 5Answers: 1

http://live.datatables.net/jedelezu/125/edit

I created a table where I place dropdowns (select2) in the header row below the colheaders via script.
Now I wanna place the sort buttons by the colheaders and not beside the dropdowns.
So I used orderCellsTop: true, but now the dropdown are also pulled from the second header row to the first. What can I do to keep the dropdowns in the second header row?

This question has accepted answers - jump to:

Answers

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

    You'll need to place those Select components on the second specifically - see here.

    The magic code is:

    .appendTo($('thead tr:eq(1) th:eq(' + this.index() + ')'))
    

    Colin

  • Murphy013Murphy013 Posts: 15Questions: 5Answers: 1
    edited April 2022

    Hi Colin,

    it works as I wanted. But somehow the search stop working and I can't see why. The search function gets the same values as before. Do yo have an idea why?
    It works only when I set 2 filters and remove one of them. Sometimes.

    Regards

  • colincolin Posts: 15,240Questions: 1Answers: 2,599
    Answer ✓
    I fixed the issue with the columns being in an incorrect order
    http://live.datatables.net/rutihoya/3/edit .

    I'm not clear why the searching isn't working, as it works if I enter the search by hand. If I have time over the weekend I'll take a look,

    Colin

  • Murphy013Murphy013 Posts: 15Questions: 5Answers: 1

    Colin, thanks a lot for your assisstance. It looks like a little bit mysterious.

  • kthorngrenkthorngren Posts: 21,344Questions: 26Answers: 4,954
    Answer ✓

    Not sure what you are trying to do with the clicked variable but its causing the preDraw to return false so the Datatable is not drawn, ie, the column search is not updated. Are you trying to keep the select box open until all the selections and then search? If so you may want to look at the Select2 closeOnSelect option.

    I updated the test case to remove the return false statement and the search works:
    http://live.datatables.net/rutihoya/5/edit

    Kevin

  • Murphy013Murphy013 Posts: 15Questions: 5Answers: 1

    Hi Colin,

    i changed

            column
                        .search( val , true, false )
                .draw();
    

    to

            column.search( val , true, false );
            column.draw();
    

    and now it works.

    Regards

  • Murphy013Murphy013 Posts: 15Questions: 5Answers: 1

    Hi Kevin,

    I use the clicked variable to prevent sorting when I click the dropdown menu.

    Regards

  • kthorngrenkthorngren Posts: 21,344Questions: 26Answers: 4,954

    You don't need that now since you have the search inputs in a different row from sorting.

    Kevin

  • Murphy013Murphy013 Posts: 15Questions: 5Answers: 1

    Hi Kevin,

    thanks for your hint.

Sign In or Register to comment.