A button to copy the content of a field to clipboard

  • 0
  • 1
  • Question
  • Updated 1 month ago
  • In Progress
I have a field in a form that I need to copy to clipboard, I'd like to create a button that does that, is it possible? I've try javascript but nothing works so far, please help and thank you
Photo of Mike Le

Mike Le

  • 70 Points

Posted 7 months ago

  • 0
  • 1
Photo of Jordan McAlister

Jordan McAlister

  • 1,460 Points 1k badge 2x thumb
anyone?

I really don’t know anything about this stuff first hand but somebody told me that there are security issues involved in copying information onto your clipboard which essentially means your copying it into your computer. I have heard you have to have an app of some kind installed to be able to do that.
I know even less than that, but it is possible for a browser to push content to your clipboard. For example, I routinely use wetransfer.com, which has a button that does just that.

Dan Diebolt's pastebin app has a button that does it, too. https://haversineconsulting.quickbase.com/db/bgcwm2m4g?a=dr&rid=726&rl=9eb

So we can be certain that it's possible in QB.
(Edited)
Photo of Jordan McAlister

Jordan McAlister

  • 1,460 Points 1k badge 2x thumb
Well, here is link to a button I am trying to replicate, and the demo works, but I'm trying to retrofit it to work for my case of just copying one field instead of multiple.

https://haversineconsulting.quickbase.com/db/bgcwm2m4g?a=dr&rid=654&_ga=2.213316500.1672376286.1559564048-1030199511.1545336323

Photo of Jordan McAlister

Jordan McAlister

  • 1,460 Points 1k badge 2x thumb
Thanks for the help! I'm not too code savvy, so some of this I haven't thought through, so your suggestions are helpful. Pole ID# is FID 3 still. I put in the console.logs and also started on basic text field. I got returns on my "querystring" and "rid" then it spits out nothing for my console.log(mytext), so I guess my API_DoQuery is the problem.
Photo of AustinK

AustinK

  • 1,338 Points 1k badge 2x thumb
Hopefully this does not keep double posting for me. So is it not giving you any kind of response back? No xml at all? It should give you an xml response that has an error or says basically nothing when it works but it will have the info you requested.

What we can do is break this down into smaller parts. I just tested this myself and got a response with the correct information. However as I hopefully said earlier(I could not edit at the time) for this to work the window NEEDS to be the focus. If it is not the focus then Chrome does not allow you to set the clipboard. When using the console, the console is the focus so it breaks. The below code should work right now but it gives me an error in console because the window is not focused. 

This is just the basic part of the code that sets up ajax and creates the DOQuery request. You will need to add the variables to it for dbidtable1, rid, and apptoken. Once that is done can you try it in console and see if it returns the xml document? It should print it out in console as "#Document" and you can then open it and see what was picked up.

  $.ajaxSetup({data: {apptoken: apptoken}});

      $.get(dbidTable1, {
        act: "API_DoQuery",
        query: `{3.EX.${rid}}`,
        clist: "165"
      }).then(function(xml) {
console.log(xml);
        var myText = $("insert field name here", xml).text();

        navigator.clipboard.writeText(info)

      });
(Edited)
Photo of Jordan McAlister

Jordan McAlister

  • 1,460 Points 1k badge 2x thumb
This is what I get:
Photo of Jordan McAlister

Jordan McAlister

  • 1,460 Points 1k badge 2x thumb
I used it with a simple text field with FID 26 and name "Notes" and within the #document, it showed the correct text it had in the notes. I don't know what the "Uncaught" error is though
Photo of AustinK

AustinK

  • 1,338 Points 1k badge 2x thumb

So right now we have figured out that that section seems to be working. So the DoQuery call works.

That uncaught error is because the window is not the focus. Since you entered it from the console the console is the focus. If you do this with a button on the form now it should work. I don't know the IOL technique very well because we don't really use it here. I wish I could help more with that part. It might be as simple as just putting the part you tested into a function and then having the button on the page call the function.