14
Views
5
Comments
Solved
Only show preview of Expression in a Table
Question

Hi all,


I created an application that contains an overview of existing tasks in a table. The table contains fields like Task Name or Description, which are linked to an underlying database.

What I want: In the field Description should only be the first 2-3 rows of the Description and the height of the row should be the same, no matter if  Description is empty, there are a few words in it or there is a long text.
I already found the style class "fixed" for the Expression field, which stops the row from adapting.  But now it looks like this:

Instead, it should only show a preview, depending on how much fits into the field and end with something like "..."

Is there any solution for this?

Thanks and best regards,

Raphael 


Rank: #2139
Solution

Hello Raphael,

You could do the following: 


What this does is, you will check first if the description is bigger then 20 characters if so it will only show the first 20 characters of the description and will add ... behind it. If not it will just show the description. This way you won't have unnecessary dots behind your descriptions.


Kind regards,


Nick

Rank: #35704

Awesome, that's exactly what I was looking for!

Rank: #484

Hi Raphael,

I think you can achieve this with some CSS. Take a look at this https://www.w3schools.com/cssref/css3_pr_text-overflow.asp and let me know if it helps.

Rank: #35704

Hi Pedro,

thanks for the hint. I found the style class "text-ellipsis" which does exactly what they explain in the link.
Now it looks like this:

it somehow "pushed out" all the other values. Do you know how I can solve this?
sorry, But I haven't worked with CSS before.

Rank: #484

There's also another option you can consider, which is using the substring function.

This will "cut" your string and only show x characters as described in the image.

Rank: #2139
Solution

Hello Raphael,

You could do the following: 


What this does is, you will check first if the description is bigger then 20 characters if so it will only show the first 20 characters of the description and will add ... behind it. If not it will just show the description. This way you won't have unnecessary dots behind your descriptions.


Kind regards,


Nick

Rank: #35704

Awesome, that's exactly what I was looking for!