Forum Discussion

ArchiveUser's avatar
ArchiveUser
Qrew Captain
9 years ago

Hover over a graphic in a column to briefly display a comment in hidden column.

Our comments column contains tons of data that I want to hide on the home page to make things look better.  We will be able to view the comments by opening each individual record, but I would like to make a column, with a notepad graphic in it, that when hovered over or pressed, will briefly display the comment.  Is this possible?
  • ChrisChris's avatar
    ChrisChris
    Qrew Assistant Captain
    9 years ago

    The html enabled formula text field would be coded like::


    "<img src='link to image source' alt=" &[comments field]& " title="&[comments field]&" />"


    the alt and title attributes would display the content of the comments field upon hover.

  • Eric_J_Hansen's avatar
    Eric_J_Hansen
    Qrew Cadet
    9 years ago
    Hi Neil,

    Yes, this is possible! We've done it before (see attached) and there are probably more ways to do it than one however, I can't think of a way to do it natively. 

    We do it with a code page that is called with the IOL technique that Dan Diebolt has discussed in this community many times. That allows us to show pretty much anything we want in a mouse over of each row. In the attached example, we are showing the most recent activity information from a child table, but it could be used for the notes instead. 

    If you need assistance, please feel free to reach out to me via my contact info in my profile.

    https://getsatisfaction.com/people/cirrusops


    Good luck!
  • Eric_J_Hansen's avatar
    Eric_J_Hansen
    Qrew Cadet
    9 years ago
    The method Chris presents would be a great example of a native way to solve for it. Thanks Chris! =]
  • Eric_J_Hansen's avatar
    Eric_J_Hansen
    Qrew Cadet
    9 years ago
    Actually, after testing it, it cuts off at the first space between words. Chris, do you have a way to fix that? I've never used this method before.
    • ChrisChris's avatar
      ChrisChris
      Qrew Assistant Captain
      9 years ago

      I find that strange because this is the result I get with the status indicators when I hover.

      _

    • ChrisChris's avatar
      ChrisChris
      Qrew Assistant Captain
      9 years ago

      Here is a sample of the code I use above. Danimal has a point. Sorry for my error there:


      "<div style='display:inline'>\n<span style='background-color:red'><img src='/i/clear2x2.gif' height=12 width=5 title='"&Round([% SLA Severity Duration Proximation]*100,0.01)&"% of severity duration has passed' alt='"&Round([% SLA Severity Duration Proximation]*100,0.01)&"% of severity duration has passed'></span>\n<span style='background-color:red'><img src='/i/clear2x2.gif' height=12 width=5 title='"&Round([% SLA Severity Duration Proximation]*100,0.01)&"% of severity duration has passed' alt='"&Round([% SLA Severity Duration Proximation]*100,0.01)&"% of severity duration has passed'></span>\n<span style='background-color:red'><img src='/i/clear2x2.gif' height=12 width=5 title='"&Round([% SLA Severity Duration Proximation]*100,0.01)&"% of severity duration has passed' alt='"&Round([% SLA Severity Duration Proximation]*100,0.01)&"% of severity duration has passed'></span>\n<span style='background-color:red'><img src='/i/clear2x2.gif' height=12 width=5 title='"&Round([% SLA Severity Duration Proximation]*100,0.01)&"% of severity duration has passed' alt='"&Round([% SLA Severity Duration Proximation]*100,0.01)&"% of severity duration has passed'></span>\n</div>",

    • _anomDiebolt_'s avatar
      _anomDiebolt_
      Qrew Elite
      9 years ago
      You expect us to read that blob of text?

      BTW, you have an extra space in this sting of text:

         "of severity durat ion has passed"

      On other matters when the text becomes that long you are better off doing this in script. Your markup can concisely be writtin in script using a new ES6 feature called string interpolation using backticks:

      var markup = '
      Hello ${variable}, how are you today?
      ';

      See: 

      https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals
  • _anomDiebolt_'s avatar
    _anomDiebolt_
    Qrew Elite
    9 years ago
    > ... it cuts off at the first space ...

    Surround the attributes with single quotes:

    "<img src='link to image source' alt='" & [comments field] & "' title='" & [comments field] & "' />"

    One limitations is that your fields cannot have single quotes within them.
  • ArchiveUser's avatar
    ArchiveUser
    Qrew Captain
    9 years ago
    Thanks!!!!!!!!!  We had to do the single quote then double quote to make it work and it's great.  I think this will become our replacement program for SharePoint for the company.