Discussions

Expand all | Collapse all

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

Eric J. Hansen03-22-2017 17:51

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

    Top
    Contributor
    Posted 03-22-2017 17:06
    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?


  • 2.  RE: Hover over a graphic in a column to briefly display a comment in hidden column.

    Bronze
    Contributor
    Posted 03-22-2017 17:20
    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!


  • 3.  RE: Hover over a graphic in a column to briefly display a comment in hidden column.

    Silver
    Contributor
    Posted 03-22-2017 17:20

    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.



  • 4.  RE: Hover over a graphic in a column to briefly display a comment in hidden column.

    Bronze
    Contributor
    Posted 03-22-2017 17:22
    The method Chris presents would be a great example of a native way to solve for it. Thanks Chris! =]


  • 5.  RE: Hover over a graphic in a column to briefly display a comment in hidden column.

    Bronze
    Contributor
    Posted 03-22-2017 17:26
    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.


  • 6.  RE: Hover over a graphic in a column to briefly display a comment in hidden column.

    Silver
    Contributor
    Posted 03-22-2017 17:41

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

    _">https://d2r1vs3d9006ap.cloudfront.net/s3_images/1571190/RackMultipart20170322-72375-1md6x7h-SLA_Indicator_inline.png?1490204443">_



  • 7.  RE: Hover over a graphic in a column to briefly display a comment in hidden column.

    Silver
    Contributor
    Posted 03-22-2017 17:43

    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>",



  • 8.  RE: Hover over a graphic in a column to briefly display a comment in hidden column.

    Top
    Contributor
    Posted 03-22-2017 17:55
    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">https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals">https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals


  • 9.  RE: Hover over a graphic in a column to briefly display a comment in hidden column.

    Silver
    Contributor
    Posted 03-22-2017 17:59

    If you think that blob is impressive, you should gawk at the whole formula, dandy. I looked and I do not find that space in the "sting".



  • 10.  RE: Hover over a graphic in a column to briefly display a comment in hidden column.

    Top
    Contributor
    Posted 03-22-2017 18:01
    I should note that QuickBase should offer string interpolation in their formula language so you would not have to concatenate strings "&". Like this:

    "Hi ${[Name]} how are you today?"

    On second thought why not just throw the formula language away and use JavaScript.

    I already have a project underway that will parse QuickBase formulas using a JavaScript parser generator library called PEGjs:

    https://pegjs.org/

    It is working out very well. Soon we will have client side formulas evaluating in JavaScript and a way to convert existing QuickBase formulas to JavaScript.


  • 11.  RE: Hover over a graphic in a column to briefly display a comment in hidden column.

    Top
    Contributor
    Posted 03-22-2017 18:04
    >I looked and I do not find that space in the "sting".

    It is there when you cut an paste it. It may be introduced through the forum.


  • 12.  RE: Hover over a graphic in a column to briefly display a comment in hidden column.

    Top
    Contributor
    Posted 03-22-2017 17:42
    > ... 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.


  • 13.  RE: Hover over a graphic in a column to briefly display a comment in hidden column.

    Bronze
    Contributor
    Posted 03-22-2017 17:51
    That worked. Thanks Dan!


  • 14.  RE: Hover over a graphic in a column to briefly display a comment in hidden column.

    Top
    Contributor
    Posted 03-22-2017 20:26
    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.