Microsoft Dynamics CRM 2011 – Hide Areas of a Form

These code snippets will hide specific areas of the Form.


// Toggle the Ribbon Toolbar to Show/Hide (same as clicking the show/hide Ribbon button)
window.top.document.getElementById("minimizeribbon").fireEvent("onclick");

// Hide the Ribbon Toolbar and move the form Content area to the top of the window.
window.top.document.getElementById("crmTopBar").style.display = "none";
window.top.document.getElementById("crmContentPanel").style.top = "0px"; // Move Form Content area up to top of window, initial style.top is 135px

// Hide Left Hand Nav bar / pane
document.getElementById("crmNavBar").parentElement.style.display = "none";
document.getElementById("tdAreas").parentElement.parentElement.parentElement.parentElement.colSpan = 2;

// Hide the Breadcrumb and Record Set Toolbar
document.getElementById("recordSetToolBar").parentElement.style.display = "none";

// Hide the Form Footer Bar
document.getElementById("crmFormFooter").parentElement.style.display = "none";

 

23 thoughts on “Microsoft Dynamics CRM 2011 – Hide Areas of a Form

  1. Geert

    Hey, any idea how to disable custom button on a ribbon?
    Something like if form is in create mode disable button…
    Thanks

    Reply
    1. Rhett Clinton Post author

      You can use the FormStateRule (RibbonDiffXml) which is a child element of the DisplayRule (RibbonDiffXml) of the Ribbon XML schema, for defining when a ribbon element should be shown. If you check ou the CRM 2011 SDK and search for FormStateRule (RibbonDiffXml) you will find information on the Ribbon XML Reference with guides on how to edit the XML for the Ribbon. This will be the best and supported way.

      In an unsupported way, if you locate the button element’s id in the DOM which (for example on the Account form, the Assign button) may resemble something like account|NoRelationship|Form|Mscrm.Form.account.Assign-Large, but there is no guarantee that this will always be this, you could try something like

      if(window.top.document.getElementById(“account|NoRelationship|Form|Mscrm.Form.account.Assign-Large”))
      window.top.document.getElementById(“account|NoRelationship|Form|Mscrm.Form.account.Assign-Large”).style.display = “none”;

      Anyhow, I hope this helps you out.

      Cheers,
      Rhett

      Reply
  2. Pingback: Working with CRM Forms in IFrame in CRM 2011 « Nishant Rana's Weblog

  3. Stefan

    Toggling the ribbon toolbar did not work for me unless i used it with the setTimeout function. It seems the page is not fully loaded when the fireEvent method is executed.

    How i got it working:

    toggleRibbonbar: function () {
    setTimeout(function () { window.top.document.getElementById(“minimizeribbon”).fireEvent(“onclick”); }, 0);
    }

    Reply
    1. Rhett Clinton Post author

      Thats great to know Stefan, thanks.

      if you’re using this in the onload event than presumeably the form scripts haven’t fully initialised yet so a setTimeout will do the trick, if you’re using this in any other form event (onsave, onchange) it should be fine without setTimeout.

      Cheers,
      Rhett

      Reply
    1. Rhett Clinton MVP Post author

      The method I’ve used and have in this blog post is by using this code.

      window.top.document.getElementById(“minimizeribbon”).fireEvent(“onclick”);

      It is just like clicking the minimise ribbon button but instead just calling it through script..

      Cheers.
      Rhett

      Reply
      1. Rhett Clinton MVP Post author

        I think the double quotes in the script may have been corrupt, can you copy and paste the example again from this blog or simply remove the double quotes and add them back in your script file.

        Cheers,
        Rhett

      2. Mohsinkhan

        Hi Rhett,
        I am trying to use your code.
        // Toggle the Ribbon Toolbar to Show/Hide (same as clicking the show/hide Ribbon button)
        window.top.document.getElementById(“minimizeribbon”).fireEvent(“onclick”);
        But i am not getting any changes. Can you tell me how to use the code. I created a webresource and called the function onLoad and Onsave events. But I get a error as object expected. No other function is called in OnLoad or Onsave event.
        I even changed the Quotes.

        Regards
        Mrpathan

      3. Rhett Clinton MVP Post author

        This looks for the minimizeribbon element by moving to the top of the DOM and then getting the element by id.

        window.top.document.getElementById(“minimizeribbon”).fireEvent(“onclick”);

        If you use the IE developer tools (F12) then you can start script debugging and inspect the object window.top.document.getElementById(“minimizeribbon”) to see if its found. Otherwise you can also look through HTML in the IE developer tool to see where this object exists.

        Cheers,
        Rhett

  4. cptboa

    Thanks pal! You’re right, the double quotes were corrupt! Now your example works! Thanks again! Have a great day!

    cheers

    Reply
  5. Pingback: CRM 2011 – Hiding a Form’s Header and Footer « .Net'ers

  6. Prabhu G

    Hi,
    This script works great for single form. When navigate to second form, its get expanded, then 3rd form its get collapsed.

    setTimeout(function () { window.top.document.getElementById(“crmRibbonManager”).control.set_isMinimized(true); }, 0);

    This script helps me.

    Regards,
    Prabhu G

    Reply
  7. Moe

    Hi Clinton,

    Great post!

    Is this supported functionality? Would I be able to deploy a solution to CRM Online which uses the above code?

    Thank!

    Reply
    1. Rhett Clinton MVP Post author

      Hi Moe,

      This is not supported javascript but it should deploye to CRM Online without any problem. Be aware that future Rollups may affect the layout of the UI and break this code.

      Cheers,
      Rhett

      Reply
  8. Xitij Thool

    worked good only If all code is copied correctly it will hide all and other thing will be hidden by CSS , but if copied only two lines IE8* crashes after Maximize.

    Reply
    1. Rhett Clinton MVP Post author

      Hi Iain, I don’t think so, unless you modify the OOB js files.

      Maybe you could try out a technique which I have never tried but maybe it could work. Add a new button to the Home ribbon and then add a custom hide rule to it that uses javascript to determine if the button should hide. In the code that you write try and access the DOM and trigger the whole toolbar to hide. It’s a long shot but better then modifying OOB files. Here is a blog post that will start you off http://howto-mscrm.blogspot.co.uk/2011/04/how-to-series-6-how-to-use-customrule.html .

      Cheers,
      Rhett

      Reply
  9. Pingback: iframe onSave Events in MS CRm 2011 | Vivek's MIcrosoft Dynamics XRM Knowledge Base (Mine ==> Preserve)

  10. Bipin Kumar

    How to hide Header lookup field using Javascript in CRM 2013 ?

    I am using below function but it is not working
    Xrm.Page.getControl(‘header_fieldName’).setVisible(false);

    Please Help !

    Reply

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.