From a3cf76a52def482cc2baea61db16c84bb03893a4 Mon Sep 17 00:00:00 2001 From: cagataycivici Date: Thu, 12 Mar 2020 14:37:29 +0300 Subject: [PATCH] Fixed #1261 - DataTable scrollHeight doesn't calculate correctly with frozen columns and header groups --- src/components/datatable/ScrollableView.js | 37 ++++++++++++++-------- 1 file changed, 24 insertions(+), 13 deletions(-) diff --git a/src/components/datatable/ScrollableView.js b/src/components/datatable/ScrollableView.js index 9538dc94a1..5aef1c47fd 100644 --- a/src/components/datatable/ScrollableView.js +++ b/src/components/datatable/ScrollableView.js @@ -79,21 +79,32 @@ export class ScrollableView extends Component { setScrollHeight() { if(this.props.scrollHeight) { - if(this.props.scrollHeight.indexOf('%') !== -1) { - let datatableContainer = this.findDataTableContainer(this.container); - this.scrollBody.style.visibility = 'hidden'; - this.scrollBody.style.height = '100px'; //temporary height to calculate static height - let containerHeight = DomHandler.getOuterHeight(datatableContainer); - let relativeHeight = DomHandler.getOuterHeight(datatableContainer.parentElement) * parseInt(this.props.scrollHeight, 10) / 100; - let staticHeight = containerHeight - 100; //total height of headers, footers, paginators - let scrollBodyHeight = (relativeHeight - staticHeight); - - this.scrollBody.style.height = 'auto'; - this.scrollBody.style.maxHeight = scrollBodyHeight + 'px'; - this.scrollBody.style.visibility = 'visible'; + let frozenView = this.container.previousElementSibling; + if(frozenView) { + let frozenScrollBody = DomHandler.findSingle(frozenView, '.p-datatable-scrollable-body'); + this.scrollBody.style.maxHeight = frozenScrollBody.style.maxHeight; } else { - this.scrollBody.style.maxHeight = this.props.scrollHeight; + if(this.props.scrollHeight.indexOf('%') !== -1) { + let datatableContainer = this.findDataTableContainer(this.container); + this.scrollBody.style.visibility = 'hidden'; + this.scrollBody.style.height = '100px'; //temporary height to calculate static height + let containerHeight = DomHandler.getOuterHeight(datatableContainer); + let relativeHeight = DomHandler.getOuterHeight(datatableContainer.parentElement) * parseInt(this.props.scrollHeight, 10) / 100; + let staticHeight = containerHeight - 100; //total height of headers, footers, paginators + let scrollBodyHeight = (relativeHeight - staticHeight); + + if (this.props.frozen) { + scrollBodyHeight -= DomHandler.calculateScrollbarWidth(); + } + + this.scrollBody.style.height = 'auto'; + this.scrollBody.style.maxHeight = scrollBodyHeight + 'px'; + this.scrollBody.style.visibility = 'visible'; + } + else { + this.scrollBody.style.maxHeight = this.props.scrollHeight; + } } } }