Xojo2024R1: copy to clipboard

I have web page with list box, it has popup menu with the menu item “copy stuff”. It is supposed to copy “stuff” from the underlying list “stuff” column for the selected row.
In the old version it is actually opening dialog window with the “stuff” in the entry field so that one can highlight it and do the standard copy menu. I suppose in Xojo2018 this was the workaround.

Is possible to actually copy to clipboard via custom menu without this workaround?
If so, can someone please give me an example please?

Hi Greg,

I have a canvas control ‘button’ that executes the following, and it works pretty well. Maybe this example will help:

Me.ExecuteJavaScript("navigator.clipboard.writeText('" + txt_area_you_want_to_copy.Text + "');")

1 Like

You probably need to explain in more detail how to do that…

You can’t just use the mentioned .ExecuteJavaScript in a WebButton.Pressed or a WebCanvas.Pressed - that doesn’t work (for me).
See also this Forum Thread: Copy Web To Clipboard with some more information about why this doesn’t work.

This only seems to work when you’re using the Web SDK, such as in @Ricardo_Cruz 's example: GitHub: piradoiv/xojo-web-cell-renderers (-> see TextWithCopyButtonCellRenderer).

Hi Jürg,

You’re right, some more detail would be handy (and one precaution as well).

I’m not using any SDK or Plug-Ins, simply Xojo Web app in the most basic form - nothing added.

I’m using a WebImageViewer on my page, because it allows me to show an icon/image, and in this WebImageViewer’s .Pressed() event I have that simple line of code:

Me.ExecuteJavaScript("navigator.clipboard.writeText('" + my_text_area.Text + "');")

That’s it.

One precaution; if you copy text that contains any ‘escape characters’, they are somehow stripped out when you paste. I haven’t tested this on multiple platforms, but this behavior appears consistent across all types of browsers on my macOS platform.

For instance, if you copy this text: “\n\nCHECK THIS OUT:\n\n”
The resulting text when you paste is: “CHECK THIS OUT:” (the text minus the escape chars)

Hope this helps clarify.

This may not work based on the security context of the page loaded in the browser. It should work when the page is loaded over SSL with a valid certificate and fail otherwise.

Reference

I’m sure you’re correct - I’ve been looking for a “works all the time just like I see on so many other sites” solution to get posted. I keep wanting to use this functionality, but don’t have the bandwidth to dig any deeper.

You’re not likely to get one because of how the Clipboard API is implemented. The security precautions are for user protection, and the implementation would vary based on what control you wish to execute clipboard interactions from. Custom JavaScript is the only answer.

As an example, you could add this code to a button’s Shown event to copy the content of a WebTextField to the clipboard:

var exec() as String
exec.Add( "(function() {")
exec.Add( "  let button = document.getElementById('" + me.ControlID + "_button')," )
exec.Add( "      field = document.getElementById('" + textFieldInstance.ControlID + "_field');" )
exec.Add( "  button.addEventListener('click', () => {" )
exec.Add( "    navigator.clipboard.writeText(field.textContent);" )
exec.Add( "    button.disabled = 'true';" )
exec.Add( "    setTimeout(() => {button.disabled = false;}, 1500);" )
exec.Add( "  });" )
exec.Add( "})();" )
ExecuteJavaScript( String.FromArray( exec, "" ) )

But you need to know where what you want to copy is stored in order to implement something like this, and even then the Clipboard API requires the user to initiate the calls via a browser event. A generic Xojo Clipboard API class isn’t likely to ever exist because of this. At the very least it would look much different than the Desktop implementation and require some hoops.

2 Likes

It’s worth noting that not all browsers support read/write clipboard use and some require extra permissions. You can read more about it here:

Thank you all for your feedback, perhaps I can use some of the ideas posted.

The web app I am working on is a substitute for the old desktop app, it is used internally and all security measures are in place such as VPN with two way authentication. The copy to clipboard is only needed for specific situation where it is known what is needed. Since the web app is used internally by well defined audience there is expectation that things should be done as easy as possible, people need to focus on biz and have little humor to deal with intricacies of programming. If copy to clipboard is not possible in Xojo then so be it, there is still awkward workaround.