Limiting the number of Text Box Characters shown in a record list.

9 posts by 2 authors in: Forums > CMS Builder
Last Post: November 15   (RSS)

By gkornbluth - November 11

Hi All,

I have a text box field in a multi record editor and I’d like to show the existence of text in that field in the record list without showing the complete contents of the text box field for each record..

Currently, unless I’ve missed something, (highly likely) my only option is to show the entire contents of the text box field in the record list for each record, and when there’s more than a few lines of text in the box, that make the record list extremely hard do use.

Showing a simple ‘yes’ or ‘no’ or, the first few words of the contents would be preferable.

Any thoughts?

Jerry Kornbluth

The first CMS Builder reference book is now available on-line!







Take advantage of a free 3 month trial subscription, only for CMSB users, at: http://www.thecmsbcookbook.com/trial.php

By kitsguru - November 14 - edited: November 14

You can do this in the custom.css file in the cmsb folder.

table.data td {
    white-space: nowrap;
    overflow: hidden;
    max-width: 180px;
    height: 30px;
    text-overflow: ellipsis;
}

You can play with the values to get it the way you want it

You can limit the effect to a specific table.

table.data[data-table="blog"] td {
    white-space: nowrap;
    overflow: hidden;
    max-width: 200px;
    max-height: 30px;
    text-overflow: ellipsis;
}
Jeff Shields

By gkornbluth - November 14

Thanks Jeff,

I'll give it a try.

Appreciate your help

Jerry Kornbluth

The first CMS Builder reference book is now available on-line!







Take advantage of a free 3 month trial subscription, only for CMSB users, at: http://www.thecmsbcookbook.com/trial.php

By gkornbluth - November 15

Hi Jeff,

Thanks again for all your help.

I opted to go with a custom.CSS solution so that upgrades don't overwrite the solution.

However, it turns out that each <br> created a new line of text in the cell regardless of any CSS height or max-height settings (see image 1)

Here's what I came up with (unless you've got a more elegant approach):

table.data[data-table="listen_live"] td {
white-space: nowrap;
overflow: hidden;
max-width: 180px;
text-overflow: ellipsis;
}

br {
display: none;
}

The difference is most evident in the 'Performance Show Timings' column.

I also had to change any <br> in the section description to <p> to maintain formatting.

(Image 1, without br css)

(image 2, with br css)

Jerry Kornbluth

The first CMS Builder reference book is now available on-line!







Take advantage of a free 3 month trial subscription, only for CMSB users, at: http://www.thecmsbcookbook.com/trial.php
Attachments:

image1.jpg 131K

image 2.jpg 123K

By kitsguru - November 15 - edited: November 15

if you prefix the br css with [data-table=‘listen-live’] then it will only impact the table not ever single BR on the list page

[data-teble="listen_live"] br {
 display: none;
}

I think the br prevented the cell from hitting the 180px width. 

Jeff Shields

By gkornbluth - November 15

Thanks for catching that, Jim. 

Do I need to add table.data as in the td css?

table.data[data-table="listen_live"] br

Jerry Kornbluth

The first CMS Builder reference book is now available on-line!







Take advantage of a free 3 month trial subscription, only for CMSB users, at: http://www.thecmsbcookbook.com/trial.php

By kitsguru - November 15

actually you don’t need table.data at all if you have the [data-table=“…”], one or the other will work. 

table.data is common to all list pages where the data-table specified the actual table being used.

Jeff Shields

By gkornbluth - November 15

Great,

thanks

Jerry Kornbluth

The first CMS Builder reference book is now available on-line!







Take advantage of a free 3 month trial subscription, only for CMSB users, at: http://www.thecmsbcookbook.com/trial.php