alalonde / angular-scrollable-table

A fixed header table directive for AngularJS
MIT License
68 stars 48 forks source link

Multiline header w/o ellipsis #54

Open Pumych opened 7 years ago

Pumych commented 7 years ago

Is there any known CSS solution for dynamic header size without ellipsis. I see the only solution with watcher, any suggestions?

rkhatri1406 commented 7 years ago

Have you find any solution ? When i try to use filters headers get distorted.

Pumych commented 7 years ago

Here is a quick and dirty solution that works for me, I run it on get data callback:

function alignHeadersHeight(){ 
            var items = angular.element('th .title');
            var maxHeight = 0;

            for(var i=0; i<items.length; i++){
                maxHeight = items[i].offsetHeight > maxHeight ? items[i].offsetHeight : maxHeight;
            }

            $('.scrollableContainer').css('padding-top', maxHeight+'px');
            $('.scrollableContainer .headerSpacer').css('height', maxHeight+'px');
            $('.scrollableContainer .th-inner').css('height', maxHeight+'px');
        }