CODEWITHSUNDEEP
cssangularjs
Debashish Halder
Debashish Halder

Reputation: 11

How to load data based on page size into ui-grid-viewport without vertical scrolling?

update:

I am new in angular. I want to load paged data into ui.grid without vertical scrollbar. Suppose i have 100 data and my page size is 50. I want to display all 50 data into ui.grid without the right sided scrollbar. When page size set to 100, 100 data will displayed into the grid. I was able to remove scrollbar but the 50 data can't be displayed. Existing UI is the current view. but i want to remove the marked scroll bar from integrated ui.grid. Please help me out.

Thank you.

Upvotes: 0

Views: 662

Answers (1)

Debashish Halder
Debashish Halder

Reputation: 11

Some overridden style(css) help me this time. ui-grid-pagination and ui-grid-auto-resize are necessary for this.

Here is the code

.ui-grid-pager-panel
{   
    position:relative !important;
}

.grid, .ui-grid
{   
    height:auto;
}
.ng-isolate-scope
{
    height:auto !important;
    #overflow: scroll ;
}
.ui-grid-canvas{

    width:auto;
    height:auto !important;
}
.ui-grid-viewport{
    height:auto !important;
    overflow-x: hidden !important;
    overflow-y: scroll !important;
}
.ui-grid-pager-container,.ui-grid-pager-count-container
{
    padding-top:5px;
}

I have solved it. here is the link.

Thanks

Upvotes: 1

Related Questions