Datagrid with few non-scrollable columns and rest grid to be horizontally scrollable

0
I need a datagrid with initial two columns as fixed/non-scrollable and rest of the columns as horizontally scrollable. Is there any widget available for such datagrid? Or any other way to achieve the same?  
asked
2 answers
1

I don’t believe that there is a widget for this – I’ve previously had to do this for a pivot table. 

You can force a table to behave the way you want it to using CSS – you will want position: absolute on the first two columns, and you might need to tweak column widths. 

I’ve had to tweak a lot of items as the layout was breaking in my case. See below the styles I used for a pivot table widget with a class of FixedFirstColumn:

.FixedFirstColumn
{
    margin-left:120px;
}

.FixedFirstColumn tr:first-child th:first-child{
    height:60px;
    border:none;
}

.FixedFirstColumn tr th:first-child{
    background-color:white;
    position:absolute;
    width:120px;
    overflow: hidden;
    margin-left:-120px;
    border: 1px solid #ccc;
    margin-top:-1px;
    height: 19px;
    
}

.FixedFirstColumn span {
    display: inherit;
    margin-bottom: 20px;
}

Hope this helps

Good luck

answered
0

I am attaching the screen print of the problem. I don’t want to have 2 vertical scroll bars.

 

 

 

answered