"Simple Copy/Paste" UI Page

[Jim Coyne]

Included in the Developer Toolbox Update Set available on Share (link to Share in the post).

This is a UI Page that I use with a couple of my other tools to display some text on screen where the user can copy it if needed:

• "GlideRecord Script" Tools
• "Show Contents of g_scratchpad" Tool

Here are the results of those tools, shown with this UI Page:

Here are the details of the UI Page record:

Name: u_fpc_simple_copy_paste
Category: General
HTML:

<textarea id="u_fpc_text_area"
		  name="u_fpc_text_area"  
		  style="width: 100%; height: auto; resize: vertical;"
		  rows="15"
		  title="${gs.getMessage('u_fpc_simple_copy_paste.text.title')}">
</textarea>
<div align="right">
	<button class="btn btn-default" id="copy_button" onclick="uFpcCopyToClipboard(); (window.GlideDialogWindow || window.GlideModalForm).prototype.locate(this).destroy(); return false" style="min-width: 5em;" title="" type="button">
		${gs.getMessage("u_fpc_developer_toolbox.button.copy")}
	</button>
</div>

Client Script:

(function() {
	//script that runs onload of the page
    try {
	//remove focus from the "x" button
        document.activeElement.blur();

        //try to set focus to the Copy button
        document.getElementById("copy_button").focus();

        var textArea = gel("u_fpc_text_area");
        //set the text string into the text area control, decoding it first
        textArea.innerHTML = decodeURIComponent("${sysparm_text}");

	} catch (err) {}
})();


function uFpcCopyToClipboard() {
	//copy the results to the clipboard
	var textArea = gel("u_fpc_text_area");
	copyToClipboard(textArea.value);
}

Here's an example script that shows how you can call the page and have the text shown in the dialog:

var variableName = "Hello world\nDoes this work?\n\Let's find out";
var gdw = new GlideDialogWindow("u_fpc_simple_copy_paste");
gdw.setTitle("This is the Title of the Dialog");
gdw.setWidth(600);
gdw.setPreference("sysparm_text", encodeURIComponent(variableName));
gdw.render();

You can run the sample code in the Xplore: Developer Toolkit.  Make sure you select "Opener: gsft_main" to have it run and open up in a tab that you have SN open in.

I figured the page might be useful for someone out there.

Attached are XML files for the UI Page and UI Message records so you can just import them into your instance.  As usual, test it out in your dev instance, or better yet, your personal dev instance first.  I've standardized on using UI Messages now for any message visible to users to make it easier to localize the tools.

Updated, May 9, 2023: Updated the "Close" button to actually copy the contents of the text area to the clipboard. So, naturally, relabelled it to "Copy".