Angular UI Grid - by applying Dynamic row height, collapse and expand column is not synchronizing with corresponding row
#6.888 aberto em 14 de nov. de 2018
Métricas do repositório
- Stars
- (5.395 stars)
- Métricas de merge de PR
- (Nenhuma PRs mesclada em 30d)
Description
problem with expand collapse button- Using dynamic row height in angular UI-grid, each row takes height according to its content, but expand/collapse column is not aligned with corresponding row. My requirement is to get it aligned with its corresponding row. If that requirement is done the Grid will be intact with browser, when ever browser is resized. Any suggestion on how to get this to work? Thanks.
these are the styles i have used .ui-grid-cell-contents for content under each cell
.ui-grid-row, .ui-grid-cell
{
height: auto !important;
}
.ui-grid-row div[role=row]
{
display: flex ;
align-content: stretch;
}
.ui-grid-viewport
{
word-wrap: break-word;
white-space: normal !important;
}
.ui-grid-cell-contents
{
padding:5px;
box-sizing: border-box;
font-size: 14px;
display: flex;
align-items: center;
white-space:normal !important;
word-wrap: break-word !important;
}
rowHeight is specified 'auto' in GridOptions
$scope.productGridOptions = {
data : 'Details',
rowHeight: 'auto',
columnDefs : [
{
},
.
.
.
]
};