Best practice for an unchangeable form field where value can be copied (2011/2013 online)

Question

I need to be able to display a case field (ticketnumber) on a case form such that

The value cannot be changed by the user
The value can be copied from the field (CTRL-C + right click/copy)
Solution to work on all crm supported browsers
Solution to work with outlook as client
Solution must use supported methods

I've tried the obvious making the field readonly which makes it un-copyable in IE8/2013 and probably other client combinations.

Just wondering if anyone has figured out the best way to do before I spend time on it. I'm tempted to use a html resource but it seems overkill...

Nicknow · Answer 1 · 2013-12-12T18:09:56.783

0

Add the field to the form's header or footer. You can now copy the field by just selecting it since it is just text but it cannot be edited.

Be sure this business rule is being enforced in a plugin or a user could accidentally (or intentionally) make the change via Bulk Edit, Excel import, OData, API, etc.

EDITED

Since IE9 won't let you copy from header/footer you can do the following:

Write a JavaScript OnLoad event to get the existing value of the field.
Write an Javascript OnChange event that changes to the field to the initial value if the user changes the value. (I would also add a pop-up telling the user the field cannot be edited - to avoid questions.)

That is the supported method.

The unsupported, do at your own risk is to cancel the KeyPress event by adding an OnLoad event handler to your form which then adds a OnKeyDown event handler to the appropriate field:

function OnLoad(){
     document.getElementById("new_field").onkeydown = 
          function(evt) { return false; };
}

Just update the "new_field" to the appropriate field name. Any attempt to edit the field will be blocked.

edited Dec 12 '13 at 18:09

answered Dec 12 '13 at 05:53

Nicknow

7,154
3
22
38

I tried header/footer but with Outlook 2010/IE9, such fields are not copyable on a form. Only way I've found so far that works everywhere is using a web resource to display the single field. Within the HTML it also matters how I write the field value into the html. document.write(...) works. Injecting innerhtml into a div doesn't. – keerz Dec 12 '13 at 14:58
Okay...I had tested it with IE10 but not IE9 - didn't realize you couldn't double-click to highlight header/footer fields in IE9. – Nicknow Dec 12 '13 at 17:58
Added some new ideas for meeting this requirement. – Nicknow Dec 12 '13 at 18:18
Thanks a lot for the suggestions. Any unsupported solutions are out for me (will update question). I considered the JS handlers which will work but clunky. I implemented the web resource but am having trouble with padding/margins. When I figure it out I will update again. – keerz Dec 12 '13 at 21:20
wow, this sucks. a web resource displaying just text is not copyable in 2011 on an update form and is not copyable in ie9 forms rendered by outlook. exact same web resource IS copyable in 2011/IE9 on a create form and in 2013/IE9 (create/update). Bottom line is if using IE8 or 9 and both outlook and browser clients, then only way I can see to get a fully copyable field is using JS hack above – keerz Dec 12 '13 at 22:53
updating myself here. in Outlook/IE9 create/update forms, text displaying in a web resource is NOT copyable. In latest Chrome same web resource IS copyable. – keerz Dec 12 '13 at 23:03

score 0 · Answer 2 · edited May 23 '17 at 10:25

Answering myself here. I ended up using a web resource with a single button. If a new form, I disable the button with button text = "no info until save". If the field I am interested in has a value, I enable the button with button text = field value.

Pressing the button uses the handy "copy to clipboard" mechanism here.

Works great in every client. Web resources don't show up in the outlook reading pane but I have the field of interest visible by default on the form so that copy of the field shows up in the reading pane. On load of the form, I make that field invisible so the user only sees the web resource.

Nicknow's javascript handler solution would work too.

update

I ended up using a readonly text element and auto-selecting the text onclick. Here's the code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript" src="/WebResources/ClientGlobalContext.js.aspx"></script>
    <meta charset="utf-8">
</head>
<body style="margin: 0px; padding: 0px;" onload="onload()">
<input id="fieldElement" onclick="onClickElement(this)" readOnly="true" value="save case for number" type="text">

<script>
    var FORM_TYPE_UPDATE = 2;
    var FORM_TYPE_READ_ONLY = 3;
    var FORM_TYPE_DISABLED = 4;

    function onload()
    {
        if (parent.Xrm.Page.ui.getFormType() == FORM_TYPE_UPDATE ||
            parent.Xrm.Page.ui.getFormType() == FORM_TYPE_READ_ONLY ||
            parent.Xrm.Page.ui.getFormType() == FORM_TYPE_DISABLED)
        {
            var value = parent.Xrm.Page.getAttribute('ticketnumber').getValue();
            document.getElementById("fieldElement").value = value;
        }
        else
        {
            // must be a create. handled by default setup
        }

        return;
    }
    function onClickElement(element)
    {
        element.select();
    }

</script>
</body>
</html>

Best practice for an unchangeable form field where value can be copied (2011/2013 online)

2 Answers2