Forum Discussion

DanaHauser's avatar
DanaHauser
Qrew Cadet
6 years ago

Working Copy to Clipboard Button

I've created a button to copy the content of a field to the clipboard that I thought would be useful to others.

It copies the content of the field and then shows an alert that confirms what was copied.

I've tested it with Chrome and Firefox which works, Edge did not. 

I used a Vibrant button, which allows me to put it into a Rich Text field with other buttons, instead of a Formula URL field.  It will work with the URL field as well if you remove the button code. 

Hope this helps.

Dana

var text CB= URLEncode([Some Field]);
var text Alert= URLEncode([Some Field] & " Was Copied to the Clipboard");
"<a class='Vibrant Success' style=\"border:0px solid green; background-color:green; text-align: center;\"href=" &
"javascript:{" & "navigator.clipboard.writeText('" & $CB & "').then(function(){" & "},function(){" & "});" & "alert('" & $Alert & "');" & "};" & ">Copy to the Clipboard</a>"


  • Awesome contribution @Dana!! If I could add 1 small enhancement idea, in order to give it a more quickbase feel:

    var text CB= URLEncode([Activity Details]);
    var text Alert= URLEncode("Activity Details" & " were Copied to the Clipboard");
    "<a class='Vibrant Success' style=\"border:0px solid green; background-color:green; text-align: center;\"href=" &  
        "javascript:{" &
    "navigator.clipboard.writeText('" & $CB & "').then(function(){" &
    "},function(){" &
    "});" &
        //"alert('" & $Alert & "');" &
        "$.jGrowl('" & $Alert & "');" &
    "};" &
        ">Copy to the Clipboard</a>"

    Replacing your "alert" with "$.jgrowl" will throw the native QB growl message which is a little prettier than a javascript alert. FYI to everyone else -- this will work for any situation where you are using alerts in this fashion.

    • CharlieMurawski's avatar
      CharlieMurawski
      Qrew Cadet
      Glad to hear! I forgot to apply css, if you see the snippet below -- this will look EXACTLY like a native alert now :)

      var text CB= URLEncode([Activity Details]);
      var text Alert= URLEncode("Activity Details" & " were Copied to the Clipboard");
       
      "<a class='Vibrant Success' style=\"border:0px solid green; background-color:green; text-align: center;\"href=" &
      "javascript:{" &
      "navigator.clipboard.writeText('" & $CB & "').then(function(){" &
      "},function(){" &
      "});" &
      "$.jGrowl('" & $Alert & "',{theme:'jGrowl-green'});" &
      "};" &
      ">Copy to the Clipboard</a>"
      • AdamKeever1's avatar
        AdamKeever1
        Qrew Commander
        This works great, thanks for sharing.

        I had to add \ , as @Mark Shnier (YQC) mentioned down further in this post, before an apostrophe to get it to copy correctly.

        So for the \ and ' you need to have \\ and \' for the URLEncode to work properly. Not sure what other characters that is true for, but that could troublesome for some if the number of characters is high.

        An If(Contains(),SearchAndReplace()) would probably be a good method for multiple characters.

        ------------------------------
        Adam Keever
        ------------------------------
    • DanaHauser's avatar
      DanaHauser
      Qrew Cadet
      Thanks for the enhancement idea Charlie.  I've been looking for a way to make a better looking pop-up then the native one for Chrome.  I'll give this one a try.  I'm not a Javascript expert by any means, but have been dabbling with some things to make the workflow for my client work better.  The more I use Javascript, the more my imagination starts to think outside the QB box. 
  • AustinK's avatar
    AustinK
    Qrew Commander
    Thanks for this. It looks much simpler to implement than the other solutions posted in the past. You could just use this as a button and not bother with IOL or any of that which is definitely my preference.

    I figure it cannot hurt to consolidate data so thought I would put a link to another copy to clipboard button. Just in case someone is searching and wants to see everything that is out there. There have been some complaints that this is no longer working but maybe it can inspire someone to fix the issues or add some features to yours even.

    https://community.quickbase.com/quickbase/topics/i-got-my-clipboard
    • DanaHauser's avatar
      DanaHauser
      Qrew Cadet
      Austin, I've used the IOL version as well, but it was being stubborn and giving me some issues.  This seems to be a good workaround.  
  • Is there a limit to what the clipboard write function can copy? It worked on little things but not the output of a massive formula rich text field.
    • DanaHauser's avatar
      DanaHauser
      Qrew Cadet
      Jordan, there is a limit based on the browser, since it uses the URL.  It's in the range of 2050 characters.  
  • @Dana...you are correct in that a URL cannot be more than a certain length however we are merely forming an href here via javascript so we are not bound by that limit per-se. I just tested with strings in the 50-60K range and it works just fine. @Jordan...how big is your string? Can you copy/paste just using your mouse? You can get the string length here: https://www.lettercount.com/
    • DanaHauser's avatar
      DanaHauser
      Qrew Cadet
      Charlie, I only needed small amounts of text to be copied, so didn't try to use it for larger amounts.  I did find that fields that are holding a lot of text were not working, so I assumed it was due to the URL limits.  It may be something different that is causing it to not work for the larger amounts.
    • CharlieMurawski's avatar
      CharlieMurawski
      Qrew Cadet
      I hacked around a bit and determined in its current state this will be problematic for rich text fields or fields with spaces, and certain escape chars. I'll work on a fix to handle these and post back here. It's definitely not a size limit though..I can get 500k chars no problem so long as the string doesn't contain the above.
    • DanaHauser's avatar
      DanaHauser
      Qrew Cadet
      That would be a big help.  Thanks for expanding on this Charlie. 
      • SamanthaSand's avatar
        SamanthaSand
        Qrew Member
        Thanks this is great!

        Snafu for me though - the field I want to copy to the clipboard is a folder location and has slashes that the URLEncode function seems to be removing. 

        So instead of the exact text string from my field that looks like this:
        O:\Corrado Construction\CCC Jobs - Awarded\17-1055 Artesian Water Recharge Facility\Project Management\Photos

        I get this, which oddly also replaced "\17" in the job number with a blank space:
        O:Corrado ConstructionCCC Jobs - Awarded-1055 Artesian Water Recharge FacilityProject ManagementPhotos​


        I just want to make it easier for my users to open a specific folder on our network from a QB record/report. Right now they manually copy the folder location to the clipboard and then paste it into File Explorer. If there's a better way to open network folders from a browser I'm open to it.



        ------------------------------
        Samantha Sand
        ------------------------------
  • MattMakris's avatar
    MattMakris
    Qrew Assistant Captain
    I'm getting an error about it having javascript:

    Only text, Quickbase-accepted functions, fields, variables, and certain HTML tags are allowed in this field. JavaScript is not supported.

    Is there a workaround?

    ------------------------------
    Matt Makris
    ------------------------------
    • SamanthaSand's avatar
      SamanthaSand
      Qrew Member
      In August 2021 QB stopped allowing "unsupported content" like javascript, presumably for security reasons. Existing javascript still works, but for any new formulas it won't let you save it.

      I found this really helpful when I needed to recreate a button action without javascript:

      https://community.quickbase.com/browse/blogs/blogviewer?BlogKey=3c579955-8f4f-40ed-89a3-ed5172a977e8&CommunityKey=d860b0f8-6a48-487b-b346-44c47a19a804

      Happy to share my code with you if that helps. It's not a button that copies to the clipboard though. It changes the values of two fields in a record.

      ------------------------------
      Samantha Sand
      ------------------------------
    • SamanthaSand's avatar
      SamanthaSand
      Qrew Member
      Mark, here's the new code I wrote to replace javascript. It's meant to be used as a button in a report to mark a record as "reviewed" with the username and date/time recorded.

      var text name = "&_FID_12=";    //FID for a user field I want to change
      var text stamp = "&_FID_13=";    //FID for a date field I want to change
      var text tk = "cm7ucz6d2iyh6db4exfkbpzgsyx";         //Apptoken for my application
      var text return = "&rdr=' + escape(window.location); return false;});";
      
          URLRoot() & "db/" & Dbid() & "?a=API_EditRecord&apptoken=" & $tk & "&rid=" & [Record ID#] &
          $name & ToText(User()) &
          "&rdr=" &
              
              URLEncode(URLRoot() & "db/" & Dbid() & "?a=API_EditRecord&apptoken=" & $tk & "&rid=" & [Record ID#] &
                  $stamp & Today() &
                  "&rdr=" &
                      URLEncode(URLRoot() & "db/" & Dbid() & "?a=doredirect&z=" & Rurl()
              ))​


      ------------------------------
      Samantha Sand
      ------------------------------