1

I have a displayed list in which the last column (called Notes) is a multi-line value. It is often quite lengthy. Screenshot HERE

This screenshot shows only one row, but the row is "tall" just because of the notes field. Imagine what a multi-row list looks like. Too tall, too much vertical scrolling.

It would be nice to somehow make the Notes cells clickable. Click the cell (or maybe just hover) and you'd get an overlay with the full text of the cell. Perhaps the cell contents could be abbreviated (or eliminated) and so the row would be not-too-tall, looking like THIS

Is this possible? If this exact solution is not possible, feel free to suggest an alternative. That is: I don't REQUIRE an overlay. I just need a way to NOT let the verbose notes field force the row to be too tall, while still offering the user a way to see the verbose contents when needed.

Steve Howard
  • 11
  • 1

1 Answers1

0

Yes, This is quite possible. You can achieve this by Client Side Rendering.

Though the view you are seeing is out of the box, you can use JSLink reference to modify these views.

Here is the article you can refer to go through: SharePoint 2013 Client Side Rendering: List Views

Also you can take a look at this thread where documentation links are available.

Once you take a look at those articles, you can have idea how you can achieve this. You will be able to place your custom HTML in the view, then you can also open the overlay with more details in it. That's all possible with the help JavaScript.

Pradip R.
  • 2,297
  • 2
  • 16
  • 39
  • Thanks for that. I tried your first sample (PriorityColor.js). I added that file to my Documents folder, and added a URL reference into the JSLink field of the view's web part. Now the view hangs. No data is displayed. – Steve Howard Sep 29 '17 at 15:45
  • Did you see any error was coming in Console of developer tools? For runtime changing in JSLink there is google chrome extension is available here: https://chrome.google.com/webstore/detail/cisar/nifbdojdggkboiifaklkamfpjcmgafpo?hl=en – Pradip R. Oct 04 '17 at 07:15