CODEWITHSUNDEEP
javascriptcssdynamichandsontable
developer
developer

Reputation: 56

show text in one line only followed by ... in handson table dynamic columns

In my handSon table I want to show the text in one line only and after that there should be ..., if there is more text.

$scope.textRenderer = function (instance, td, row, col, prop, value, cellProperties) {
            if (cellProperties) {
               
                var template;
                template = ['<span style="white-space:nowrap; overflow:hidden;text-overflow: ellipsis;">' + value + '</span>'].join('');
                while (td.firstChild) {
                    td.removeChild(td.firstChild);
                }

                if (!td.firstChild) {
                    td.appendChild($compile(template)($scope)[0]);
                }
            }
            return td;
        };

I have tried the above code but the ellipsis is not shown.

Upvotes: 0

Views: 60

Answers (1)

James
James

Reputation: 1123

What you're trying to do does not work on inline elements.

Give your span tag display:block;

Upvotes: 2

Related Questions