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, 2022 (RSS)
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
Take advantage of a free 3 month trial subscription, only for CMSB users, at: http://www.thecmsbcookbook.com/trial.php
By kitsguru - November 14, 2022 - edited: November 14, 2022
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;
}By kitsguru - November 14, 2022 - edited: November 14, 2022
If the TD cells were identified, then you could target the column but that would be a change to the core (HINT).
Adding a data-column="colName" would do it.
In lib/menu/default/list_functions.php
change line 629
$tdAttributes = "style='text-align:left'";
// TO
$tdAttributes = "style='text-align:left' data-column='$fieldname'";THEN
[data-table="blog"] [data-column="myColumn"] {
white-space: nowrap;
overflow: hidden;
max-width: 200px;
max-height: 30px;
text-overflow: ellipsis;
}Would target the myColumn for the blog table
Thanks Jeff,
I'll give it a try.
Appreciate your help
Jerry Kornbluth
Take advantage of a free 3 month trial subscription, only for CMSB users, at: http://www.thecmsbcookbook.com/trial.php
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
Take advantage of a free 3 month trial subscription, only for CMSB users, at: http://www.thecmsbcookbook.com/trial.php
By kitsguru - November 15, 2022 - edited: November 15, 2022
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.
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
Take advantage of a free 3 month trial subscription, only for CMSB users, at: http://www.thecmsbcookbook.com/trial.php
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.
Great,
thanks
Jerry Kornbluth
Take advantage of a free 3 month trial subscription, only for CMSB users, at: http://www.thecmsbcookbook.com/trial.php