javascript - Truncate "Multiple lines of text" column in Sharepoint Online list - Stack Overflow

admin管理员组

文章数量:1289868

I'm stuck on a particular scenario right now because of a recent change by Microsoft in Office 365 regarding the "Multiple lines of text" column in a Sharepoint list.

My main goal is to truncate this column. If this column will have a lot of characters in it, it'll eat up the display page because it can have up to 60k characters.

I'm looking to limit the rows of this column on the list page into like 5rows only and then add a see more button if possible?

I've found this article about formatting a column in sharepoint list using JSON.

I've seen that you can put the column into a div using this script but I'm just wondering if I'll be able to limit the rows of this column using JSON?

{ "$schema": ".schema.json", "elmType": "div", "txtContent": "@currentField" }

I'm stuck on a particular scenario right now because of a recent change by Microsoft in Office 365 regarding the "Multiple lines of text" column in a Sharepoint list.

My main goal is to truncate this column. If this column will have a lot of characters in it, it'll eat up the display page because it can have up to 60k characters.

I'm looking to limit the rows of this column on the list page into like 5rows only and then add a see more button if possible?

I've found this article about formatting a column in sharepoint list using JSON. https://learn.microsoft./en-us/sharepoint/dev/declarative-customization/column-formatting

I've seen that you can put the column into a div using this script but I'm just wondering if I'll be able to limit the rows of this column using JSON?

{ "$schema": "https://developer.microsoft./json-schemas/sp/v2/column-formatting.schema.json", "elmType": "div", "txtContent": "@currentField" }

• javascript
• html
• json
• sharepoint
• sharepoint-online

Share Improve this question Follow edited May 9, 2020 at 11:43 Jonathan Hall 79.8k1919 gold badges159159 silver badges203203 bronze badges asked Feb 20, 2020 at 16:43 Richard YuRichard Yu 4111 gold badge11 silver badge22 bronze badges 2

• Please upvote to 100 so Microsoft can fix that new feature sharepoint.uservoice./forums/329214-sites-and-collaboration/… – Marko Tica Commented Feb 21, 2020 at 9:55
• 2 I'm the one who submitted that suggestion though – Richard Yu Commented Feb 21, 2020 at 14:16

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 3

SharePoint list View formatting only allows a subset of css. Notice that there are no styles with "-webkit-" prefix. Refer to the documentation here - https://learn.microsoft./en-us/sharepoint/dev/declarative-customization/column-formatting#style

View formatting expressions should be enough. You'll have to ensure that the Multi-line field is configured as a plain text or rich but not enhanced (View formatting doesn't support this yet). I have used the below expression against Multi-line plain text field.

{
   "$schema": "https://developer.microsoft./json-schemas/sp/v2/column-formatting.schema.json",
   "elmType": "div",
   "txtContent": "=substring(@currentField, 0, 140) + '...'"
}

"Yes" to the limiting to a certain number of lines of text, but "No" to the "see more" button, at least within the capabilities of JSON Formatting.

You can limit the number of lines display with an ellipses ("...") by adding line-clamp CSS styles to your div. Note the value of -webkit-line-clamp is the number of lines you want to display.

{
   "$schema": "https://developer.microsoft./json-schemas/sp/v2/column-formatting.schema.json",
   "elmType": "div",
   "style": {
          "display": "-webkit-box",
          "-webkit-line-clamp": 3,
          "-webkit-box-orient": "vertical",
          "overflow": "hidden"
   },
   "txtContent": "@currentField"
}

However, you cannot embed JavaScript in a JSON column formatter, so if you want a "see more" button that can toggle display the rest of the text, you will need to build a custom-coded SharePoint Framework (SPFx) Field Extension.

I'm also stuck with huge custom controls, inject JS, etc figure out that for me this fulfill my needs with small effort

"$schema": "https://developer.microsoft./json-schemas/sp/v2/column-formatting.schema.json",
   "elmType": "div",
   "style": {
          "display": "-webkit-box",
          "overflow": "auto",
          "max-height":"2em"
   },
   "txtContent": "@currentField"
}

row is small enough, value isn't lost, and I can scroll or select all and paste somewhere to read all

Apologies if i'm opening back an old thread but this is the closest to what i am looking for. I have a column that contains multiline data and I am trying to keep only the first line visible and hide the rest so I can have a nice displayed list with minimum gap between the lines. Ideally a JSON script to customize the column formatting. I tried to keep only a certain number of characters visible, works but then again the problem is that when you open the record, the information in that multiline field is not showing but only the number of characters we limited to be displayed in the first place.

I was thinking about putting the value of the first line in a different column (single line text) and have the rest in a different column, that i can just hide. but when i hide that column, i am not able to use my power automate flow as it detects that it is not available (...) if i can get that to work then my problem is resolved.

Appreciate everyone's input.

本文标签： javascriptTruncate quotMultiple lines of textquot column in Sharepoint Online listStack Overflow