Thursday, June 14, 2012

Dynamics CRM 2011 readonly form javascript


Dynamics CRM 2011 read-only form JavaScript.

With it does:
1)     Hides the content of a form with transparent div.
Pros:
1)     Easier way to disable all the controls of the form and enabling them while keeping all the logic of the form (pre disabled controls will keep be disabled).
2)     It's faster than going over all the controls and disabling them.
Cons:
1)     Partially Unsupported

How to guide:
1)     Create new JavaScript web resource
2)     Add this code:
            //Disable all form controls
            DisableForm = function() {
                        var iframeDoc = document;
                        var iframeBody = document.getElementById("crmFormTabContainer");
                        hideContent(iframeDoc, iframeBody);
                        Xrm.Page.ui.tabs.forEach(
                                    function(tab, index)
                                    {
                                                Xrm.Page.ui.tabs.get(index).add_tabStateChange(function()
                                                {
                                                            var iframeDoc = document;
                                                            var iframeBody = document.getElementById("crmFormTabContainer");
                                                            var roSpan = document.getElementById("readonlySpan");
                                                            if (roSpan != null) {
                                                                        iframeBody.removeChild(roSpan);
                                                            }
                                                            hideContent(iframeDoc, iframeBody);
                                                });
                                    }
                        );
            }

            hideContent = function(htmlDocument, htmlElement) {
                        var roSpan = htmlDocument.createElement("div");
                        roSpan.id = "readonlySpan";
                       
                        var roStyle = "position:absolute;";
                        roStyle += "z-index:1;";
                        roStyle += "left:0px;";
                        roStyle += "top:0px;";
                        roStyle += "height:"+htmlElement.scrollHeight+"px;";
                        roStyle += "text-align:center;";
                        roStyle += "font:72px Tahoma;";
                        roStyle += "opacity:0.20;";
                        roStyle += "-moz-opacity:0.20;";
                        roStyle += '-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=20)";';
                        roStyle += 'filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=20)"';
                        roStyle += "filter: alpha(opacity=20);";
                        roStyle += "background-color:white;";

                        roSpan.style.cssText = roStyle;
                        htmlElement.appendChild(roSpan);
                        roSpan.innerHTML = "<div style='margin-top:30%;height:100px;'>READ ONLY</div>";
                        roSpan.style.zoom = 1;
            }
           
            //Enable all form control keep readonly / disable logic.
            EnableForm = function() {
                        var iframeBody = document.getElementById("crmFormTabContainer");
                        var roSpan = document.getElementById("readonlySpan");
                        if (roSpan != null) {
                                    iframeBody.removeChild(roSpan);
                        }
            }
3)     Add DisableForm function to onload event of the form.

**Another way to disable all the controls

Good luck.


No comments:

Post a Comment