Scrollbar's position not inner last table column

Scrollbar's position not inner last table column

hungncvhungncv Posts: 9Questions: 2Answers: 0

I using datatable to show data with dynamic column and column width need to fit-content.
But when scrollbar is not inner last table column, same as below link.
http://live.datatables.net/fopilode/1/edit
I need to take scrollbar's position to inner last table column.
I' ll try solution in below link
https://datatables.net/forums/discussion/34348/positioning-scrollbar-and-rounded-edges#Comment_91740
But actually, scrollbar's position still has in outter of last table column. If fill background for column header, then header of scrollbar still blank.
Have got Anyone has solution for me ?

Answers

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

    Unless I'm missing something, that thread has the answer. I took the CSS from that thread, added it to your example and it seems to be doing what you want - see here.

    Could you look at that, please, and see if it helps. If it's still not working for you, please can you update my example, or link to your page, so that we can see the problem.

    Cheers,

    Colin

  • hungncvhungncv Posts: 9Questions: 2Answers: 0

    @colin : Sorry, but It still doesn't seem to match what I need.
    I see that, the scrollbar has still at outter of last column.
    When I add style for header row by style='background-color:green', the upper part of the scroll bar is still white.
    http://live.datatables.net/zetuvosa/3/edit

    I need this part is green, same as last column, and scrollbar really within last column (sort icon is in righ side of column, which is white color now).

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

    You can do that with CSS for ".dataTables_scrollHeadInner" - see here

    Colin

  • hungncvhungncv Posts: 9Questions: 2Answers: 0
    edited April 2020

    @colin : thank for your support, but my datatable is not simply single background-color.
    My datatable need change background-color for active column (difference to other columns), change background-color when mouse over, ...
    If according to using CSS, i must change somethings to handle style of dataTables_scrollHeadInner according to last column.
    Is there any way to meet that?
    Using Jquery right ?

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

    CSS is a fiddly beast, we'd really need to see the cases you're describing, with instructions on how to reproduce, without it, we get prolonged threads like this one :)

    Colin

  • hungncvhungncv Posts: 9Questions: 2Answers: 0

    @Colin : Sorry for not clearly describing it in the first times.
    I describe again for more clearly.
    My datatable has some style :
    1.light blue for active column header.
    2. dark bule for inactive column header.
    3. light blue for column header which is mouse overed.
    So I need handle to the upper part of the scroll bar change background color according to background color of last column.
    and some cases need to handle, such as :
    1. the upper part of the scroll bar need change background color when last column is inactive.
    2. the upper part of the scroll bar need change background color when last column is active.
    3. the upper part of the scroll bar need change background color when last column is is mouse overed.
    I think that CSS is difficult to do that and trying to use jquery but don't know that datatable has gotten method to support it or not.

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

    As I said, we really need to see this to progress it. Can you update my example to demonstrate the problem, please.

    Colin

  • hungncvhungncv Posts: 9Questions: 2Answers: 0

    @colin : thank for your support.
    I found solution for my problem.
    I 've updated my code as below
    http://live.datatables.net/zetuvosa/8/edit

    (when I click on Salary column, background of Salary column is changed to yellow and background of upper part of the scroll bar has change to yellow too)

    By using Jquery, background of upper part of the scroll bar could changed follow background of last column, so looks like they are one column.

  • hungncvhungncv Posts: 9Questions: 2Answers: 0
    edited May 2020

    @colin : I found other issuess :
    when has no scrollbar, header still a unnecessary part (part at above of scrollbar if scroll bar is showed)

    How to make header fit to body content ?

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

    I'm not seeing that in your last example - http://live.datatables.net/zetuvosa/11/edit

    Can you update that to demonstrate the issue, please.

    Colin

This discussion has been closed.